Jquery 引导词缀在页面中间开始

我希望我的页面上有多个部分，每个部分都有一个堆叠的导航。堆叠导航应保留在剖面分区中。 第一个堆叠导航保留在第一个部分中

第二个堆叠导航在滚动时跳到底部并返回。 谁能告诉我发生了什么事，我怎样才能解决这个问题

演示：

---

您可以通过为所有可附加的侧边栏指定一些标识类，然后：

$（'.sideNav'）。每个（函数（）{
$（this.affix（{/*options*/}）；
});

然后您只需要为每个部分设置顶部和底部

$（此）。粘贴({
偏移量：{
顶部：功能（e）{
变量$curSection=$（e）.最近（'.row'）；
返回（this.top=$curSection.offset（）.top-10）；
},
底部：功能（e）{
var$nextSection=$（e）.最近的（'section'）。下一个（'section'）；
//如果是最后一个元素，请转到页面底部
var bottom=（$nextSection.length==0）？0:
$（文档）.height（）-$nextSection.offset（）.top；
返回（this.bottom=bottom）；
}
}
});

当图元不再在

顶部

和

底部

的范围内时，将应用

粘贴顶部

和

粘贴底部

。您通常只希望这些元素返回到正常流，因此您可以这样设置css（或者甚至完全忽略，因为相对是默认位置）：

。粘贴顶部，
.贴底{
位置：相对位置；
}

应用“词缀”类时，可以按如下方式设置列表样式：

。粘贴{
位置：固定！重要；
顶部：10px；
}

---

非常感谢，它起作用了。我花了很多时间在这个问题上，甚至从来没有接近这个解决方案。