悬停的jQuery动画只能在悬停一次但不是后续

Question

任何可能导致冲突的想法都会阻止jQuery上的第二个回调函数悬停，然后阻止第一次运行任何额外的时间？

    jQuery(document).ready(function($) {

        $(".nav ul ul").css({ display: 'none' });
        $(".nav ul li").hover(function() {
            $(this).find('ul.sub-menu')
                .stop(true, true).delay(50).animate({ "height": "show", "opacity": "show" }, 600 );
        }, function(){
            $(this).find('ul.sub-menu')
                .stop(true, true).delay(50).animate({ "height": "hide", "opacity": "hide" }, 600 );
        });

    });

Answer 1

我发现了问题。 css文件中存在冲突。一旦使用了悬停功能，就会出现css样式：

ul.nav li:hover > ul,
.nav ul li:hover > ul {
    display: block;
}

这覆盖了jQuery，只是在没有动画的情况下快速显示块样式的下拉列表。