javascript - mouseenter mouseleave 没有按照我认为应该的方式工作

Question

我对 jQuery 比较陌生，我似乎被这个 mouseenter/mouseleave 问题困扰。我想设置一个当页面不在顶部时“隐藏”的菜单，这似乎工作正常，当它隐藏时我想这样做，以便当用户将鼠标悬停在它上面时类切换和菜单回来了。但是，当它滚动回顶部时我不希望出现这种情况。当页面首次加载(在 Firefox 和 Chrome 中)并且我还没有滚动时，它工作正常，但向下滚动并返回到顶部后，菜单将隐藏在 mouseleave 上。

这是一个jsFiddle我当前的代码设置。

我已经尝试解决这个问题有一段时间了，并尝试了一些其他方法。

我尝试像这样使用悬停

$("#access").hover(function() {
            $(this).removeClass("scroll").addClass("normal");
        }, function() {
            $(this).removeClass("normal").addClass("scroll");
        });

但这与我现在拥有的代码做了同样的事情。

我尝试过的其他一些方法是将 b 变量传递给另一个函数，创建一个单独的 div 并跟踪它的位置以确定是否使用 mouseenter/mouseleave，最后绑定(bind)它们，但这些都没有似乎按我的想法工作。

我想不出还有什么可以尝试的，所以我不确定这是否是我做错的事情，或者这是否甚至不可能像这样完成。

这是我的第一个问题，我试图包含尽可能多的信息，希望有足够的信息。

Answer 1

试试这个

$(document).ready(function() {
    $(window).scroll(function() {
        var b = $(window).scrollTop();
        $("#access").toggleClass("normal", b == 0)
        $("#access").toggleClass("scroll", b > 0)
    });
    $("#access").hover(function() {           
        if($(window).scrollTop() > 0){
            $("#access").toggleClass("normal scroll");
        }
    });
});​

http://jsfiddle.net/bJquD/6/