1. #1
    Touch Premium Member
    Join Date
    Jul 2011
    Location
    Cuernavaca, Mexico
    Posts
    53
    Vote Rating
    1
    Answers
    2
    ErnestoR is on a distinguished road

      0  

    Default Answered: Text Sprite - Font property in IE7

    Answered: Text Sprite - Font property in IE7


    I want to change the font of my Text Sprite to serif.
    Im using Extjs 4.1.0

    I have the following code

    Code:
    Ext.application({
        name: 'FontFamilies',
        launch: function() {
        Ext.QuickTips.init();
            var drawComponent = Ext.create('Ext.draw.Component', {
                viewBox   : false,
                draggable : true,
                items     : [
                    {
                        type : 'text',
                        text : 'SERIF',
                        font : 'italic 32px serif',
                        x    : 10,
                        y    : 40
                    }
                ]
            });
    
    
            Ext.create('Ext.Window', {
                width  : 215,
                height : 235,
                layout : 'fit',
                items  : [drawComponent]
            }).show();
        }
    });
    My code works correctly in Firefox, Safari and Chrome but in IE7 the text sprite renders in tahoma.

    Does IE7 support this the font family property in a Text Sprite?
    Last edited by ErnestoR; 8 Aug 2012 at 12:23 PM. Reason: added Extjs version 4.1

  2. Correction it is working only that the documentation is misleading.

    the font should be declared WITH double quotes like this

    Code:
    textStyle: {
        fill: '#000',
        font: '18px "Times"'
    }

  3. #2
    Touch Premium Member
    Join Date
    Jul 2011
    Location
    Cuernavaca, Mexico
    Posts
    53
    Vote Rating
    1
    Answers
    2
    ErnestoR is on a distinguished road

      0  

    Default


    Correction it is working only that the documentation is misleading.

    the font should be declared WITH double quotes like this

    Code:
    textStyle: {
        fill: '#000',
        font: '18px "Times"'
    }