Javascript StickyNav-调试

这是我为sticky navbar编写的代码（使用自定义引导navbar），它在桌面浏览器上运行得非常好……但是

var num

是以像素为单位测量的，而不是

em

。这对移动设备来说并不适用

有没有办法：

• 在

  em

  中测量滚动，而不是

  px

  或者

• 检测杆何时撞击窗口顶部，然后使其粘住，而不是使用硬编码测量

---

您遇到的问题与移动设备上的不同测量无关，因为在任何设备上都是以像素为单位进行测量和计算的。在移动设备上，导航栏的位置很可能只是不同而已

是的，一个解决方案是获取导航栏的当前偏移量，并使用它代替硬编码的“num”，如下所示：

// STICKY NAVBAR

var num = 816; //number of pixels before modifying styles

$(window).bind('scroll', function () {
    if ($(window).scrollTop() > num) {
        $('.navbar').addClass('navbar-fixed-top');
    } else {
        $('.navbar').removeClass('navbar-fixed-top');
    }
});

但请记住，这种方法假设导航条的位置在其使用寿命内不会改变。处理响应设计后，每次内容包装器元素的大小更改时，都应该重新计算导航栏偏移量。 这整件事有多复杂，你可以在这里查看：

var navbarOffset = $('.navbar').offset();
var num = navbarOffset.top;