引导3词缀位置刷新

Question

我已经配置了大部分作品的词缀，如可以在此页面上可以看到：http://wisderm.com/ingredients/Green+Tea+Extract

这是我的代码，用于动态改变词缀偏移：

// nav-pills is the class of the <ul> element of the sidebar 
// #hero-unit is the jumbotron 

// where to start scrolling from 
$('.nav-pills').affix({ 
    offset: { top: function() { return $('#hero-unit').outerHeight(true)+10; } } 
}); 

// after changing from affix-top to affix 
$('.nav-pills').on('affixed.bs.affix', function() { 
    $('.nav-pills').css("margin-top", function() { return -$('#hero-unit').outerHeight(true)+10; }); 
}); 

// after changing back to from affix to affix-top 
$('.nav-pills').on('affixed-top.bs.affix', function() { 
    $('.nav-pills').css("margin-top", 0); 
}); 

问题是，一旦我向下滚动到affix-top已更改为affix的位置，并且我刷新页面时，加载的词缀比页面下的要低得多。为什么会发生这种情况，我该如何解决？

Answer 1

那么，这是一个老问题，但答案将帮助别人：

你的问题是由添加事件监听器固定在初始化词缀之前。在Github上https://github.com/twbs/bootstrap/pull/14331

查看线程试试这个：

// after changing from affix-top to affix 
$('.nav-pills').on('affixed.bs.affix', function() { 
    $('.nav-pills').css("margin-top", function() { return -$('#hero-unit').outerHeight(true)+10; }); 
}); 

// after changing back to from affix to affix-top 
$('.nav-pills').on('affixed-top.bs.affix', function() { 
    $('.nav-pills').css("margin-top", 0); 
}); 
$('.nav-pills').affix({ 
    offset: { top: function() { return $('#hero-unit').outerHeight(true)+10; } } 
});