Results 1 to 6 of 6

Thread: Function to change the html style

  1. #1
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default Answered: Function to change the html style

    Hi may i know how should i change the HTML style with the function
    for example (but this one will change the element only, I want to change the style for the <img>:

    Code:
    xtype: 'panel',
    listeners: onTabImage,
     items: [{
               html: '<div class="pop" align="center"><img style="max-width:100%; max-height:100%; z-index:1;" src="www.image.xxxx" /></div>'
     }]
    
    var onTabImage =
    [{
                            element: 'element',
                            event: 'tap',
                            fn: (function(e,node,options,eOpts) {
    
                                this.element.setStyle("max-height","50%");
                            })
    }];
    Thanks

  2. This should work:

    Code:
    var img_Items = Ext.DomQuery.select('div.pop img');     // get Array of images
    
    // iterate through array:
    Ext.Array.each(img_Items, function(image) {
        image.style.cssText = "max-height: 50%;"; 
        //image.className += "some_CSS_Class";     // alternative with adding a css class   
       
    });

  3. #2
    Sencha User
    Join Date
    May 2012
    Posts
    154
    Answers
    8
    Vote Rating
    6
      0  

    Default

    Maybe this


    Code:
    var img_Items = Ext.DomQuery.select('div.pop img');
    img_Items.setStyle('max-height', '50%');

  4. #3
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    Quote Originally Posted by klaus777 View Post
    Maybe this


    Code:
    var img_Items = Ext.DomQuery.select('div.pop img');
    img_Items.setStyle('max-height', '50%');
    Thanks but I get this error
    Object [object Array] has no method 'setStyle'

  5. #4
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,149
    Answers
    132
    Vote Rating
    101
      1  

    Default

    Since the DomQuery is returning an array, you will need to supply an index to img_Items.

  6. #5
    Sencha User
    Join Date
    May 2012
    Posts
    154
    Answers
    8
    Vote Rating
    6
      2  

    Default

    This should work:

    Code:
    var img_Items = Ext.DomQuery.select('div.pop img');     // get Array of images
    
    // iterate through array:
    Ext.Array.each(img_Items, function(image) {
        image.style.cssText = "max-height: 50%;"; 
        //image.className += "some_CSS_Class";     // alternative with adding a css class   
       
    });

  7. #6
    Sencha User
    Join Date
    May 2013
    Posts
    25
    Vote Rating
    1
      0  

    Default

    Thanks

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •