Question

一旦用户向下滚动1000px，我想在我的网站的左栏中显示一个固定的菜单，但对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 )

你正在寻找1000px滚动，但由于你的代码

，它似乎是100px

滚动1000px后更改CSS类

2 个答案: