jquery悬停：鼠标悬停未触发

Question

这是发生了什么（下面的代码块）：

1. 我正在开发一个简单的下拉导航（基于嵌套的 Ul）。
2. 主 UL 的 ID 为 #nav。
3. hover-> mouseout 函数不会触发（所有浏览器）
4. 在 Chrome 12.0.742.122、Safari (5.05)、Opera (11.50)、IE (9.0) 中，第一次鼠标悬停后，任何 后续 鼠标悬停不 动画（即 slideDown） .8)。事实上，它ONLY 似乎在 Firefox (5.0) 中有效。
5. 我仅在 Windows (7) 上进行了测试。还没有 mac...。
6. 让动画再次工作的唯一方法是刷新到页面。
7. 我从一年多前发布的 Nettuts tutorial 中了解到这一点，不敢相信它已经过时了。
8. 仅供参考：我在我的 html 页面底部调用 jQuery 和下面的脚本。
9. 另一个仅供参考：我仍然相当绿色，所以清晰回应会非常有帮助

有什么想法吗？ 提前致谢， 卧铺

    var site = function(){
       this.navLI = $('#nav > li').children('ul').css('display','none').end();
       this.init();
    };

    site.prototype = {
       init: function(){
          this.setMenu();
       },

    // enables the slide down menu and adds support for ie6
        setMenu: function(){
           this.navLI.hover(function(){
               // mouseover
               $(this).find('> ul').stop(true, true).slideDown(250);
           }, function(){
               // mouseout
               $(this).find('> ul').stop(true, true).fadeOut(200);
           });
        }
    }

    new site();

Answer 1

您的ul 元素不需要在CSS 中使用display: none。看看这个updated fiddle，你会看到想要的效果。