1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    19
    Vote Rating
    0
    shraddhasalekar is on a distinguished road

      0  

    Default Unanswered: cell highlighting on mouse over

    Unanswered: cell highlighting on mouse over


    Hi,
    Though there is plenty of material already present on this topic, I am not successful to achieve this yet.
    I am using EXTJS 4 and trying to achieve some highlight on cells when mouse hovers on it.

    My code -
    listeners:{
    itemmouseenter:'cellMouseOverHandler',
    itemmouseleave:'cellMouseOffHandler'
    },

    cellMouseOverHandler: function(t, record, item, index, e, eOpts) {
    var el = Ext.get(e.getTarget());
    el.dom.style.border = 'solid 1px blue';
    },
    cellMouseOffHandler: function(t, record, item, index, e, eOpts) {
    var el = Ext.get(e.getTarget());
    el.dom.style.border = '';
    },


    I want to put border color to cells. With above code, borders are created, but not always. Border Behavior is uncertain.

    I am able to capture mouse over and mouse leave events correctly with above events. But I am not able to change html styles of cells in that.

    Please suggest.

    Thanks!

  2. #2
    Sencha User
    Join Date
    May 2011
    Location
    Ukraine, Rivne
    Posts
    250
    Answers
    44
    Vote Rating
    42
    redraid has a spectacular aura about redraid has a spectacular aura about redraid has a spectacular aura about

      0  

    Default


    use css:
    Code:
    .x-grid-cell:hover {
        border: 1px solid blue;
    }
    If you want apply hover not for all grids/trees - use cls config
    Code:
    // grid config
    cls: 'mygrid'
    
    // css
    .mygrid .x-grid-cell:hover {
        border: 1px solid blue;
    }

  3. #3
    Sencha User
    Join Date
    Apr 2012
    Posts
    19
    Vote Rating
    0
    shraddhasalekar is on a distinguished road

      0  

    Default


    Thanks Redraid, its done!!

Thread Participants: 1

Tags for this Thread