javascript - 卷轴上的 box-sizing : border-box is causing an error on a JS fixed position sidebar,

Question

我有一些 javascript 将固定类应用到我的侧边栏，所以当你滚动时，菜单会一直在你身边。 Stackoverflow 有类似问题侧边栏。

    $(function() {      
    var top = $('.side-menu').offset().top - parseFloat($('.side-menu').css('margin-top').replace(/auto/, 0));
    $(window).scroll(function (event) {
      // what the y position of the scroll is
      var y = $(this).scrollTop();

      // whether that's below the form

      if (y >= top) {

        // if so, ad the fixed class
        $('.side-menu').addClass('fixed');
        $('body').addClass('fixed-sidebar');

      } else {
        // otherwise remove it
        $('.side-menu').removeClass('fixed');
        $('body').removeClass('fixed-sidebar');
      }
    });
});

在我的 CSS 中，我有 * { box-sizing: border-box; } 导致 else 关闭并且页面跳转。当我删除 box-sizing 时，固定菜单可以正常工作。

我的问题是

• 还有其他方法可以实现我想要做的事情吗？
• 有没有办法取消设置 box-sizing 属性？

编辑

使用此链接进行演示:在不同高度调整浏览器窗口的大小，您会看到问题。 http://dev.danielcgold.com/fixed-menu.html

Answer 1

当然你总是可以做(selector) { box-sizing: content-box } 。 (这将“取消设置”您的 box-sizing...)