开发者

jQuery hover / slideDown problem

开发者 https://www.devze.com 2023-03-10 13:21 出处:网络
I am fairly using simple jquery method to a dropdown. But the code isnt working in firefox 3.5 and lower nor opera. Is their an alternative to these browsers for hover or slideDown?? Its working great

I am fairly using simple jquery method to a dropdown. But the code isnt working in firefox 3.5 and lower nor opera. Is their an alternative to these browsers for hover or slideDown?? Its working great on webkit, firefox 3.6 up and IE8+

HTML

<ul id="menu">
  <li>
    <ul> <!-- this is the dropdown part -->
      <li><a href="#">#</a></li>
      <li><a href="#">#</a&开发者_如何学Gogt;</li>
    </ul> <!-- end dropdown -->
  </li>
</ul>

jQuery

$('#menu li').hover(
    function () {
        $('ul', this).slideDown(250);
    },
    function () {
        $('ul', this).slideUp(250);         
    }
);


An adaptation of your code works perfectly well, for me, in both Chromium 11 and Firefox 4 (Ubuntu 11.04):

$('#menu > li:has("ul")').hover(
    function(){
        $(this).find('ul').slideDown();
    },
    function(){
        $(this).find('ul').slideUp();
    });

JS Fiddle.

Notes:

  • $('#menu > li:has("ul")') is just a more specific selector (it targets only immediate descendants of the #menu element, that are both li elements and contain a ul element).
  • $(this).find('ul') is the same as your context selector ($('ul,this)) except that internally jQuery calls the $(this).find() method anyway:

Internally, selector context is implemented with the .find() method, so $('span', this) is equivalent to $(this).find('span').

Reference:

  • Selector context at the jQuery API.
0

精彩评论

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