问题标签 [affix]

我有最新的浏览器版本，我的代码很简单：

在 firefox 上一切正常，但在 Chrome 中它不起作用，我无法在 chrome 中控制台记录 scrollTop()，控制台中没有任何内容:(

这是 JSFIDDLE ，先在 Firefox上 检查，然后在 Chrome 上检查 :(

我在全宽英雄图像下方的导航栏上设置了词缀，所需的结果是导航栏向上滚动，并且一旦触及页面顶部，它就会粘住。问题是，图像高度是动态的，它是全宽图像，所以我不能为偏移设置固定的像素高度。我正在使用 jquery 根据导航栏位置设置偏移量，但导航栏一旦到达顶部就会跳回原来的位置。

.affix此 CSS 应在应用时定位我的导航栏

这是生成词缀的jQuery

这是一个jsfiddle：http: //jsfiddle.net/MarkMarine/q3J56/4/

我根据下面的响应进行了一些编辑（并对其进行了一些调整）对我来说，修复是为词缀偏移选择 .hero-image 类的高度，而不是导航栏的位置。

谢谢！！！为后代更新了 jsfiddle

http://jsfiddle.net/MarkMarine/q3J56/7/

我敢肯定这很简单，但我对 Bootstrap 甚至 html/css 还是很陌生。

我希望我的导航栏在我的标题之后并在滚动过去时固定在顶部。我得到了这个工作，但是：导航栏在滚动和我的其他内容上方时变得透明且不可点击。

我该如何克服这个？

这是我的.html：

`

`

这是我的 .css 词缀：

这是我的词缀相关的js：

谢谢！

我正在尝试制定一个固定 div 的算法，该 div 的高度（滚动时）会增长，直到它等于视口的高度或相对于另一个 div和 视口底部具有固定位置的 div

当用户滚动那么远时，我正在使用 Twitter Bootstrap 词缀将我的辅助导航栏（黄色）和侧边栏（黑色）锁定到屏幕顶部。这工作正常。侧边栏是给我带来麻烦的部分。当它处于其起始位置时（如下图所示），我希望栏的顶部位于辅助导航栏（黄色）下方 30px 和页面底部上方 30px 处。 

当用户滚动时，该栏的高度应增加，使其保持在辅助导航栏下方 30 像素和屏幕底部上方 30 像素（如下图所示）

酒吧固定位置后，我可以做我需要做的事情。  

我想不通的是如何相对于我的辅助导航栏定位侧边栏的顶部，以及相对于屏幕底部的侧边栏的底部。我尝试计算滚动开始和结束时侧边栏的高度，但这会导致问题。

我还尝试计算侧边栏的最终高度，并让侧边栏的底部刚好超出屏幕边缘（当它处于初始位置时），但如果右侧没有足够的内容来保证滚动，我无法到达滚动条的底部项目。另外，我的屏幕开始以一种非常不吸引人的方式弹跳。

以下是当前使用的代码：

    此代码在页面加载时调用，并在窗口调整大小时再次调用。任何帮助将不胜感激！

我在页面加载时设置 JavaScript 函数调用：

在一些用户交互之后value发生了变化，同时我再次调用上面的代码，期望affix()它将使用新值进行处理offset，但事实并非如此，它仍在处理value页面加载时的初始内容。

为什么会这样？可能有人可以解释吗？窗口调整大小触发窗口调整大小我确保通过使用alert功能

我affix()在 twitter 引导程序中使用它，而且我对http://github.com/davist11/jQuery-One-Page-Nav插件3.0也有同样的问题

onePageNav()offsetValue如果我onePageNav()像上面那样在屏幕上调整大小，则不应用新的affix()。

在我在 iPad 上的网站上测试了 affix 后，我发现它无法正常工作，我发现这是 iOS 的问题https://github.com/twbs/bootstrap/issues/11560，目前没有简单的解决方案那。

iOS 只是在滚动时计算固定位置存在问题。基本上你不会得到更新的固定位置，直到你停止滚动后稍有延迟

我可以做些什么来让它工作，可能有人已经做了一些工作吗？

页面上有两个主要元素：“标题图像”和“导航栏”。图像使用边距部分重叠导航栏。

默认情况下，由于一些我不知道的技巧，它可以正常工作。图像与导航栏重叠，但导航栏中的链接仍在图像透明的区域中工作

然而，一旦导航栏被固定（位置：滚动后固定，通过词缀插件）这个技巧就不再起作用 - 导航栏与图像重叠。我的html如下：

CSS如下

你可以在这里找到它的图片（base64） http://jsfiddle.net/5qYK8/9/

当我尝试使用 z-index 时，即使在默认情况下，图像也会与导航栏完全重叠，并且链接根本不起作用。你可以在这里找到它 http://jsfiddle.net/5qYK8/8/

是否可以使用工作按钮使图像（红十字的一部分）在固定和非固定情况下与导航栏重叠？有人至少可以解释为什么 Button 在图像重叠时在第一种情况下工作吗？

我一直在使用 bootstrap3 和 Jekyll 来改进网站。我为 _include 文件夹创建了一个 header.html 文件，该文件将包含在页面中，以在下方提供 jumbotron 和导航栏。这是整个文件夹副本的链接，以防我在此处省略任何内容，并且索引页面应加载到可能会或可能不会遇到我的问题的其他人的浏览器中：https ://www.dropbox.com/sh/bv59k92zjt142vp/ F62a6bxeCJ

我的问题是，如果我在 localhost 4000（Jekyll 服务器设置为观看模式）的浏览器中加载 index.html，header.html 和我的 index.html 内容中的所有内容都会正确显示，但是当我滚动时，有时当导航栏固定在顶部，其下方页面的内容继续滚动并与栏重叠，有时不会。此外，如果当内容未与导航栏重叠时，我将鼠标悬停在索引页面内容中的按钮上，则在鼠标悬停时，它会与导航栏重叠并停留在那里。

我很难理解为什么会这样。除了文件夹的链接之外，我还在下面提供了我的 header.html 代码和 css。

如您所见，标题有一个带有附加行为的导航栏：

导航栏应该贴在顶部。索引页面对应的相关 CSS 在我的 custom.css 文件中定义：

我的自定义 CSS 中有两个用于导航栏的整体，一个用于通常的导航栏，一个用于附加版本：

它们看起来都很相似，但是贴上的栏看起来只是略有不同，就像背景颜色相同但缺少未贴上时相同的阴影导航栏，我注意到如果我使用 bootstraps 词缀插件来处理其他东西（如 nag）之间的细微差别药丸 - 文字似乎......略微偏离，有时不存在一些阴影。有没有办法我可以更改#menubar.affix 的条目，使其获得与原始栏相同的所有设置（包括引导程序设置的默认值）+我在那里获得的其他内容，例如更改后的 '位置'变量，z-index等？

谢谢，本。

我不知道为什么，但是当你overflow-x:hidden在 body 元素上有 CSS 样式时，词缀插件就不起作用了。它只是拒绝在词缀、词缀顶部和词缀底部之间切换。

我猜它无法检测或测量滚动位置，但我不知道为什么overflow-x:hidden会导致这种情况。

不幸的是，我需要overflow-x:hidden因此删除它不是一个好的解决方法。

关于如何/在哪里看的任何想法？