javascript - Bootstrap Affix 插件导航栏顶部延迟

Question

我正在使用最新版本的 bootstrap 3。我正在使用词缀插件来固定静态导航栏。但是它可以工作，在导航栏更新并固定在顶部之前会有很长的延迟。它在所有浏览器上都是可重复的。

我认为用视频展示问题最简单，我还提供了一些代码。

see video

see JSFiddle

<h1></h1>

我想要的效果是干净的瞬间过渡

这个“http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_affix&”

我还应该指出，我正在使用 jQuery 来定义我的部分高度和词缀偏移量，我最初认为这会导致延迟，但现在我认为这是不可能的。

这对我来说像是一个性能问题。我认为 jQuery 计算高度并将样式应用于导航栏的时间有点太长了。

我希望有人能对这件事有所了解。

Answer 1

所以我想出了问题所在。

我写了使用 jQuery 来获取标题(导航栏上方的内容)的高度，在这种情况下它是一个视频，并使其成为词缀偏移量。我解决跳跃问题的方法是将 offset 属性设为计算标题高度的函数，而不是静态变量。

Here is the updated JSFiddle

https://jsfiddle.net/DTcHh/23013/