滚动1000像素下来后更改CSS类(Change CSS class after scrolling

我希望有一个固定的菜单出现在我的网站，一旦用户滚动1000像素下的左栏，但我不是很有经验与jQuery / JS。 我觉得像这样的工作，但它没有做任何事情：

HTML：

<div id="menu">[MENU_WILL_GO_HERE]</div>

样式：

#menu{display:none;}​

JQ：

var fixed = false;
 ​$(document).scroll(function() {
    if( $(this).scrollTop() > 100 ) {
        if( !fixed ) {
           fixed = true;
           $('#menu').css({position:'fixed', display:'block'});
        }
        } else {
           if( fixed ) {
               fixed = false;
               $('#menu').css({display:'none'});
        } 
    } 
});​

问：

是否有一个原因，这并不工作？ 该代码是一个例子http://jsfiddle.net/roXon/psvn9/1/ ，甚至当我复制/粘贴正是这个例子，因为它是到一个空白的HTML页面，使用最新的jQuery库的一个环节，它仍然无法正常工作像它说的jsfiddle页面上。 我该怎么办可以俯瞰？

Answer 1:

你的括号是错在你的榜样，但无论如何，可以简化您的代码：

CSS：

#menu {
    display : none;
    position : fixed;
}

JS：

 $(document).scroll(function() {
    $('#menu').toggle($(this).scrollTop()>1000)
 });​ 

演示 ： http://jsfiddle.net/elclanrs/h3qyV/1/

Answer 2:

编辑这样

if( $(this).scrollTop() > 1000 )

您正在寻找1000像素滚动，但它似乎100像素，由于这一点，从您的代码

文章来源: Change CSS class after scrolling 1000px down