将您向上滚动的每个像素的导航栏顶部位置-1px移动到20px

Question

我有以下内容： -

HTML

<div id="test"></div>
<span></span>

CSS

#test {
    border:1px solid grey;
    height:50px;
    width:100%;
    top: 0;
    position:fixed;
}
span {
    position:absolute;
    height:2000px;
    width:10px;
}

的jQuery

$(window).scroll(function () {
    var pos = $(this).scrollTop();
    var toppos = '-'+pos+'px';
    $("#test").css({'top' : toppos});
    $('#test').stop().animate({
        top: (pos >=20?20:pos)
    }, 0);
});

Fiddle Here

基本上，对于每个滚动1px，我想将#test顶部位置设置为负数（滚动的像素数量）。

滚动1px = top：-1px;等等......直到达到20px。

它有点工作，但在我的代码中它似乎忽略了我设置的负值？

有什么想法吗？

Answer 1

这应该有效：

$('#test').stop().animate({
    top: (pos >=20?20:-pos)
}, 0);