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 bothli
elements and contain aul
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.
精彩评论