Twitter bootstrap 更改词缀偏移量可能会有所帮助。据说他基本上有同样的问题并发布了我的问题的解决方案,但不幸的是我无法让它工作。
这是 Bootstrap Affix 插件页面(如果你知道另一种/比使用这个插件更好的方法,我全都听好了——这个插件不是必需的):http: //twitter.github.com/bootstrap/javascript.html#词缀
这是一个有助于显示我的问题的小提琴......但由于某种原因我无法让 Bootstrap Affix 做任何事情。:|
$(function () {
$('#contentbody-toolbar').addClass("affix-top").each(function (){
var $self = $(this);
if ($("#advanced-total-outer").is(":visible")) {
var offsetFn = function () {
var $p = $('#advanced-total-outer').outerHeight();
var h = 175 + $p;
return h;
}
$self.affix({offset: {top: offsetFn}});
} else {
var offsetFn = function () {
var h = 175;
return h;
}
$self.affix({offset: {top: offsetFn}});
}
});
});
编辑:我将上面的代码简化为(应该做同样的事情):
$(function () {
$('#contentbody-toolbar').addClass("affix-top").each(function (){
var $self = $(this);
var offsetFn = function () {
var $p = $('.wrapper.clearfix.no-bord').outerHeight();
var h = 175 + $p;
return h;
$self.affix({offset: {top: offsetFn}});
};
});
});
但无论如何,这就是我的页面的基本设置方式,当您向下滚动并且导航栏(#contentbody-toolbar)位于窗口顶部时,它会修复它。现在,问题是,如您所见,我隐藏了一个可以取消隐藏的 div。因此,当该元素没有以某种方式隐藏时,我需要更新偏移量。
如果用户愿意,标头也可以更改大小(高度),因此它也需要为此更新。我在上面发布的代码对我来说似乎是合乎逻辑的,并且在它识别偏移更改的意义上它似乎“工作”,但是如果有意义的话,附加插件显然不会更新 DOM 中的更改。滚动 175 像素后,它将始终固定。
几天来,我一直试图让这个工作,老实说,我很沮丧。我真的不知道该怎么做。提问时 Stackoverflow 的侧边栏似乎可以按我的意愿运行,但我找不到他们的 moveScroller 脚本。
感谢提供的任何帮助,非常感谢。