调整大小时不重新计算粘贴位置

Affix position not being recalculated on resize

本文关键字:计算 位置 小时 新计算 调整      更新时间:2023-10-03

我想让我的导航栏在滚动时变得固定,即使在调整窗口大小时它也会到达顶部。

即使我将其设置为在$(window).resize()时重新计算值,它被触发的位置也不会更新。怎么了?

$(document).ready ->
  $(window).resize ->
    windowHeight = $(window).height()
    navHeight = $('#navbar-affixable-wrapper > #navbar.affixable').outerHeight()
    windowMinusNavHeight = windowHeight - navHeight
    $('#navbar-affixable-wrapper > #navbar.affixable').affix
      offset: { top: windowMinusNavHeight }

或者在javascript:中

$(document).ready(function() {
  return $(window).resize(function() {
    var navHeight, windowHeight, windowMinusNavHeight;
    windowHeight = $(window).height();
    navHeight = $('#navbar-affixable-wrapper > #navbar.affixable').outerHeight();
    windowMinusNavHeight = windowHeight - navHeight;
    return $('#navbar-affixable-wrapper > #navbar.affixable').affix({
      offset: {
        top: windowMinusNavHeight
      }
    });
  });
});

是否可以将偏移量顶部值作为函数返回?

例如:

$(function(){
   var $window = $( window );
   var $navbar = $('#navbar-affixable-wrapper > #navbar.affixable');
   $navbar.affix({
      offset: {
        top: function(){
           // Calculate offset top value
           return $window.height() - $navbar.outerHeight( true ); // I always pass true in there so margin is taken into consideration.
        }
      }
    })
});

您可以在Bootstrap网站上查看粘贴文档。