滚动后只能使用Javascript固定顶部导航栏

Question

是否有人知道在 lesscss.org 上使用了哪些javascript效果来创建导航栏效果，其中导航栏在滚动到某个点之后才会固定到顶部。如果有人有实际的代码示例或指向教程的链接，那将不胜感激。

Answer 1

使用window.onscroll事件

进行javascript检查

在靠近顶部的HTML源代码中：

window.onscroll = function () {
    if (!docked && (menu.offsetTop - scrollTop() < 0)) {
      menu.style.top = 0;
      menu.style.position = 'fixed';
      menu.className = 'docked';
      docked = true;
    } else if (docked && scrollTop() <= init) {
      menu.style.position = 'absolute';
      menu.style.top = init + 'px';
      menu.className = menu.className.replace('docked', '');
      docked = false;
    }
};