我有一个想要“子导航”的网站。因此,当您滚动到部分时,其工具栏将固定在主工具栏下方。我可以正常工作,但初始化后无法更改顶部偏移量。文档说:
贴上('刷新')
将词缀与添加或删除元素结合使用时
从 DOM 中,您需要调用刷新方法:
但是当我尝试这个时我得到:
未捕获的类型错误:对象#没有方法“刷新”
这是我的代码:
$(function () {
$('.sec-nav').addClass("affix-top");
var adjustNavs = function (first) {
$('.sec-nav').each(function (){
var $p = $(this).closest('.sec');
var $$ = $p.prevAll('.sec');
console.log($$);
var h = 0;
$$.each(function () { h+=$(this).outerHeight();});
console.log(h);
if (first) {
$(this).affix({offset: {top: h}});
} else {
$(this).data('affix', {b: {options: {offset:{top: h}}}});
console.log(this);
$(this).affix('refresh')
}
});
}
adjustNavs(true);
$('.sec').bind('DOMSubtreeModified', function () {
adjustNavs();
});
});
我尝试过不同的变体
$(this).data('affix', {b: {options: {offset:{top: h}}}});
包括:
$(this).affix({offset: {top: h}});
我无法改变偏移量。如何更改 Affix 插件的偏移量?谢谢。
我想到了。我没有动态更新偏移量,而是将偏移值更改为函数:
$(function () {
$('.sec-nav').addClass("affix-top").each(function (){
var $self = $(this);
var offsetFn = function () {
var $p = $self.closest('.sec');
var $$ = $p.prevAll('.sec');
var h = 0;
$$.each(function () { h+=$(this).outerHeight();});
return h;
}
$self.affix({offset: {top: offsetFn}});
});
});
现在,当某个部分由于 dom 操作或窗口大小调整而发生变化时,偏移量会由于函数返回值的变化而自动更改。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)