jQuery和css中的下拉菜单问题

Question

为什么slideDown()和slideUp()在我的菜单上不起作用？ 用mouseover()重复几次。

见到你：jsfiddle-my codes

$('#nav li').mouseover(function() {
        $('#nav li ul li').slideDown();
    })
    .mouseout(function(){
        $('#nav li ul li').slideUp();
    })

Answer 1

尝试使用hover（mouseenter和mouseleave的快捷方式），然后更改您的选择器：

$('#nav > li').hover(function() {
    $('#nav li ul li').slideDown();
}, function() {
    $('#nav li ul li').slideUp();
})

示例： http://jsfiddle.net/andrewwhitaker/jdsGx/

以前，这些事件与li下的所有#nav绑定。我想你只想要直接的孩子，child selector会得到你

Answer 2

我会这样做：

http://jsfiddle.net/5KEnp/4/

$('#nav > li').mouseenter(function() {
    $('ul li', this).stop(true, true).slideDown();
}).mouseleave(function(){
    $('ul li', this).stop(true, true).slideUp();
})