滚动时为什么滚动/跟随菜单弹跳？

Question

（1）向上和向下滚动（在移动设备中）时，我的滚动/关注菜单反弹很多。我该如何解决这个问题以纠正用户体验？

（2）滚动时，菜单似乎也不在页面顶部。我能解决这个问题吗？

我在这里使用它：http://www.pablitogreco.com/book/#b

演示：http://jsfiddle.net/c0pnrvc6/

HTML

<div class=scroller>Xtango</div>

CSS

.scroller {
position: relative;
top: 0px;
width: 100%;
background-color: #fff;
z-index: 2}

的Javascript

$(window).scroll(function() {
if ($(window).scrollTop() > -1) {
$('.scroller').css('top', $(window).scrollTop());}});

Answer 1

删除Javascript并制作滚动条position: sticky。

Answer 2

只需使用css并删除jquery。它正在发挥作用。

.scroller {
 position: fixed;
 top: 0px;
 width: 100%;
 background-color: #fff;
 z-index: 2
}