5

一旦用户向下滚动 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 页面上那样工作。我可以忽略什么?

4

2 回答 2

17

您的示例中的大括号是错误的,但无论如何,您都可以简化代码:

CSS

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

JS

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

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

于 2012-09-18T05:07:02.930 回答
0

像这样编辑

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

您正在寻找 1000px 滚动,但由于这个原因,它显示为 100px,来自您的代码

于 2012-09-18T05:10:48.357 回答