1. #1
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
    stevanovich is on a distinguished road

      0  

    Question [SOLVED] Add an icon for title of ext.Window

    [SOLVED] Add an icon for title of ext.Window


    Hello ,

    I woul like to know if it's possible to insert an icon in the title of a window.

    PHP Code:
     win = new Ext.Window({
                
    title    'Lanceur',
                
    closable true,
                
    width    850,
                
    height   600,
                
    //border : false,
                
    plain    true,
                
    layout   'border',
                
    icon'icons/telephone.png',
                
    cls:'x-btn-left'
    I think i do not use the good css.
    Or not the best way.

    Thanks !
    Last edited by stevanovich; 27 Nov 2008 at 5:17 AM. Reason: [SOLVED]

  2. #2

  3. #3
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
    stevanovich is on a distinguished road

      0  

    Talking Strange !

    Strange !


    Thanks Animal for quick reply !!!

    I already use this for tabs, sorry for disturbing !!!

    But , i'm still confusing about using iconCls, I mut setting them in html, otherwise it's nos possible to define in js.

    in js
    PHP Code:
            win = new Ext.Window({
                
    title    'Lanceur GlooMan',
                
    closable true,
                
    width    850,
                
    height   600,
                
    //border : false,
                
    plain    true,
                
    layout   'border',
                
    //iconCls : 'Arbre_Bannis', // work by html setting
                
    iconCls :  '.Arbre_Bannis {background-image:url(icons/report_delete.png);}'// not Work 
    In html

    PHP Code:
    <style type="text/css">
        
    htmlbody {
            
    font:normal 12px verdana;
            
    margin:0;
            
    padding:0;
            
    border:0 none;
            
    overflow:hidden;
            
    height:100%;
        }
        
    {
            
    margin:5px;
        }
    ....
        .
    Arbre_Bannis {
            
    background-image:url(icons/report_delete.png);
        }
    ...    
        </
    style
    I miss something ???
    (change path to ../ to ../../ etc, still not working)

  4. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,546
    Vote Rating
    62
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You ned to learn HTML before you begin buildnig RIA apps!

    A class is a class name. A DOM Element has a string which can contain class names.

    You then specify styling rules which use selectors which are based on class names to apply the rules to elements.

  5. #5
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
    stevanovich is on a distinguished road

      0  

    Talking Wow, direct reply !

    Wow, direct reply !


    Quote Originally Posted by Animal View Post
    You ned to learn HTML before you begin buildnig RIA apps!
    Thanks !
    I confirm : i'm not an html expert ! (and not an Extjs expert !)

    Maybe my question was stupid ?
    I just folow the link you put on your post, and i read it:

    iconCls : String A CSS class that will provide a background image to be used as the header icon (defaults to ''). An example custom ic...
    A CSS class that will provide a background image to be used as the header icon (defaults to ''). An example custom icon class would be something like: .my-icon { background: url(../images/my-icon.gif) 0 6px no-repeat !important;}
    So, am I stupid to think that extjs was able to setting new css ???

    I should use ext.util.css ?

    A class is a class name. A DOM Element has a string which can contain class names.
    You then specify styling rules which use selectors which are based on class names to apply the rules to elements.
    I'm agree with you !

    Thanks for reply.

  6. #6
    Sencha User
    Join Date
    Sep 2008
    Posts
    83
    Vote Rating
    0
    frankthetank is on a distinguished road

      0  

    Default


    your iconCls whould be 'Arbre_Bannis', the name of the Class if I'm not wrong.
    Nevermind, missread, you already tried that !! My bad.

  7. #7
    Ext User
    Join Date
    Sep 2008
    Location
    FRANCE, Rennes
    Posts
    68
    Vote Rating
    0
    stevanovich is on a distinguished road

      0  

    Default


    Yes, as i explain in my example , after animal explanation, iconCls works fine with 'Arbre_Bannis'.

    My read of API documentation was wrong: example given for ".my-icon { background: url(../images/my-icon.gif) 0 6px no-repeat !important;}" is only for css setting, in html or other.

Thread Participants: 2