javascript - 粘性 header 不起作用-javascript

一直在粘性头文件上工作，我想为头文件而不是插件编写自己的javascript代码，由于某种原因，尽管我认为这是正确的，但我的小提琴似乎无法工作。

<script>
var nav = document.querySelector('.sticker');
var top = nav.offsetTop;

function scroll(e) {
if (window.scrollY>=top) {
sticker.classList.add('sticky');
}
else {
sticker.classList.remove('sticky');
}
}
document.addEventListener('scroll', scroll);
</script>

/*css*/
.sticky{
position: fixed;
top: 0;

}

jsfiddle- http://jsfiddle.net/j9rfmq4e/10/

附注-新手，所以请在评论中保持轻松

最佳答案

更改classList时，您引用了元素“ sticker”的类名，而不是在脚本开始时声明的“ nav”变量，这将返回错误。

sticker.classList.add('sticky');

应该

nav.classList.add('sticky');