在调整大小时不会重新计算词缀位置

时间:2015-02-12 02:26:23

标签: javascript resize window-resize affix

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

即使我将其设置为在$(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
      }
    });
  });
});

1 个答案:

答案 0 :(得分:0)

你能否将偏移顶值作为函数返回?

例如:

$(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网站上查看affix documentation