javascript - 页面滚动上的跟随标题不跟随

Question

我试图让典型的菜单跟随网页滚动，

我想改变与页面滚动相关的 marginTop 的位置，

$(document).ready(function(){

    $(window).scroll(function(){
        var v= $(document).scrollTop();
        console.log(v);
        if(v>50){
            $('.menu').css({'marinTop':v+'px'});
            console.log(true);
        }else{
            $('.menu').css('marginTop','50px');                        
            console.log(false);
        }
    });
});

但它只是不会移动酒吧......：s

Answer 1

这里：

$(document).ready(function(){
    $(window).scroll(function(){
        var value = $(window).scrollTop();
        if(value>+$('.menu').css('marginTop').replace(/px$/, "")) {
            $('.menu').css({'position':'fixed','top': 0});
        }else{
            $('.menu').css('position','static');                        
        }
    });
});

修复了 2 件事：

• 删除了".px"（css("marginTop")返回"50px"，不能与数字比较）
• 你真的应该使用“ position: fixed”而不是javascript更新的“ position: absolute”