开发者

Attaching onmouseover after page is rendered?

Hi,

When the page first is rendered my div elements looks like this :

<div onmousedown="this.className='showhideExtra_down_click';"
   onmouseout="this.className='showhi开发者_JAVA百科deExtra_down';"
   onmouseover="this.className='showhideExtra_down_hover';"
   class="showhideExtra_down" id="extraFilterDropDownButton">&nbsp;</div>

Then i manually updates the onmouse attributes with javascript so it looks like this :

<div onmousedown="this.className='showhideExtra_down_click';"
   onmouseout="this.className='showhideExtra_down';"
   onmouseover="this.className='showhideExtra_down_hover';"
   class="showhideExtra_down" id="extraFilterDropDownButton">&nbsp;</div>

They looks the same, the big difference is that the first one will change class when hovering and the second will not? Is it not possible to set this after page is rendered?

Please note : I need IE6 compability, thats why I use onmouse instead of CSS hover

BestRegards

Edit : This is what I found and that works grate, I haven´t tested it in IE6 just yet :

$("#extraFilterButton").hover(function() {
                $(this).attr('class','showhideExtra_down_hover');
            }, 
            function() {
                $(this).attr('class','showhideExtra_down');
            });


you can use:

$('#selector').live('mouseover',function(){//something todo when mouse over})

live() allows for dynamic changes

(you can do the same for 'mouseout')


To expand on @maniator's correct answer, I would use:

$("#some_id").live("hover",
  function() {
    // do on mouseover
  },
  function() {
    // do on mouseout
  });


This is what I ended up with :

    $("#extraFilterDropDownButton").hover(function() {
        if($('#divCategoryFilter').css("display") == 'block'){
            $(this).attr('class','showhideExtra_up_hover');
        }
        else{
            $(this).attr('class','showhideExtra_down_hover');
        }
    }, 
    function() {

        if($('#divCategoryFilter').css("display") == 'block'){
            $(this).attr('class','showhideExtra_up');
        }
        else{
            $(this).attr('class','showhideExtra_down');
        }
    });

This is however not yet tested in IE6.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜