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

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}

Java脚本

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

Answer 1

删除Javascript，并使滚动条position: sticky变为position: sticky 。

Answer 2

只需使用CSS并删除jquery。 这是工作。

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