我有一个带有标准引导导航栏的页面。在此之下,我将附加一个“引脚”,一旦用户滚动过去的像素(在我的情况下,导航栏的高度为41像素,所以在41px的affix踢,并通过将.affix类更改为.affix {顶部:41px}一切都很好)
所以对于这个第一个粘贴我可以使用仅html属性。
进一步的页面(本质上可以被认为是“第二页”)我有另一个导航,应该“贴”,并且一旦用户滚动到某个位置,替换第一个子导航 – 鉴于第二个由于内容,page / affix是可变的,我使用js来计算第一页的高度,并根据我所得到的设置偏移量:{top:xxx}。
如果用户向下滚动一下,则第一个子导航词缀将会启动,如果他继续滚动并进入第二个子导航,进入下一个页面,并将其替换为第一个附加的子页面-nav(实际上它本身并不取代它,而是用更高的z-index替代)
从这里我有两个问题,我无法找到一个解决方案:
>当用户重新调整窗口尺寸时,第一页的内容当然会变得更长,这会改变我的原始偏移顶部尺寸,以便粘贴页面。首先,我认为一个简单的调用.affix(‘refresh’)将会/可能是解决方案,但当然这个方法甚至不可用在组件上。接下来,我想我可以再次手动重新计算高度,并重新创建$(‘。my-second-affix’)。affix({offset:{top:x-new-offset}}); – 但是由于某种原因,这似乎不起作用,我无法弄明白为什么:(
>接下来要解决的问题是,我也使用jquery infinitescroll加载越来越多的页面…每个页面可能会有其他子导航在不同的阶段,我想粘贴和替换哪个最后一个affix是现在在顶部。
注意,我还要确保,如果用户滚动回先前附加的子导航将重新贴上自己向后的另一个方向(我怀疑只要粘贴偏移量正确,它们会很好)
希望这个解释足以突出我的问题,有人或者已经处理过这个问题,或者可以为解决方案提供一些指导。我试图使偏移量是一个返回顶部的当前偏移量的函数(如另一个问题Twitter bootstrap change affix offset中提到的),但是由于某种原因,如果没有按预期的方式工作。
任何帮助是极大的赞赏