问题标签 [scrollspy]

我有一个通过 ajax 加载的子菜单。我正在尝试使用 Bootstraps scrollspy 根据用户在当前页面上的位置突出显示子菜单。但是它不适用于我的子菜单。我相信它是因为它是通过 ajax 加载的。如何让子菜单突出显示？

子导航.html

主页.html

我正在使用 bootstrap 中的 scrollpsy。

我举了一个例子来说明我正在尝试做的事情：

http://jsfiddle.net/te3V4/15/

一切都很好，他在每个部分 id 传递一个活动类li，但我想在每个部分的标题处更改背景

例如：

如果#studio background-color: #0915ff;
如果#green background-color: 085606;

我想使用 Scrollspy 插件制作一个 Bootstrap 导航栏。当我尝试使用它时，最后一个<li>标签始终保持活动状态，但不会让其他<li>元素变为活动状态。如果你想要我的代码：http ://pastebin.com/raw.php?i=QL99wh2C这是我正在谈论的图像：http: //i.stack.imgur.com/CYzg9.png

文档说：

或者

我想使用第二种方法（js/jquery）。 似乎您应该调用.scrollspy()导航，并且不确定如何指定要“监视”哪个元素...无法使其正常工作！

编辑

我使用以下代码创建了自己的修复程序。它使用偏移量来获取锚标记的位置，并在到达该滚动点时将活动类添加到导航列表项。运行良好且高效：

结束编辑

正如标题所示，我有 Scrollspy（显然使用 Bootstrap），我用 Javascript 初始化它：

$('#navbar').scrollspy();

哪个工作正常。但是，如果导航栏中的列表元素（li 标签）之一引用了一个模态的 div，它就会翻转。当我开始滚动时，它会将活动类从该列表项翻转到该滚动位置处的正确列表项，因此导航栏列表项看起来像是在您向上和向下滚动时不断闪烁。这是我的导航栏和我身体的开始：

如您所见，最后一个列表项（“联系人”）是破坏它的原因。删除“滚动”类没有任何帮助。我不确定问题出在哪里，但是更改该列表项上的 href 可以解决整个问题。此外，我在导航栏下方的轮播中有一个按钮，它也打开了模式。它似乎不会导致这个问题 - 如果我更改 Contact li 的 href 但让按钮指向上面代码中 Contact 指向的相同模式，这也可以正常工作。

这是重要的情况下的模态：

任何帮助将不胜感激。

更新：

我注释掉了$('#navbar').scrollspy();，它仍然在发生。删除我的模态代码有效，所以我不确定问题是什么......除了这个，模态函数很好。任何想法发生了什么？

I have a project in which I use ScrollSpy and I have a section with tabbed content. The problem is that the script from this tabbed content blocks ScrollSpy showing the correct active item in the nav bar. This tabbed content is in the 3rd section of the page, all goes well until I select 4th menu item and from there on all goes wrong. I think that ScrollSpy is looking for the hidden tabs and somehow counts them too. Is there a way of forcing ScrollSpy to skip searching in one particular section and just move on? Or do you have any other idea on this? Here's the link to the problematic page http://oz.zz.mu/HongKongExpats/ maybe it will help you.

PS. The menu works correctly, it scrolls to the correct section, it only show the wrong menu item as active.

PPS. ScrollSpy it's showing as active the last menu item because I have to have body height: 100%, but I've managed to hide that with a last hidden menu item.

我一直在使用 Twitter Bootstrap Scrollspy 插件，但在我的一生中，我无法让它工作。这是内容区域的 HTML

这是导航栏的 HTML 代码

我看过其他一些帖子，但对于我的生活，我无法弄清楚为什么它只选择了导航栏中的最后一项。

谁能帮我弄清楚为什么scrollspy只选择最后一项以及如何纠正它？

我正在开发一个 twitter bootstrap scrollspy 导航。除了导航栏和一个小错误之外，其他一切都正常工作，当前选定的项目在您滚动到该部分的底部之前不会改变。我在这里谈论的一个例子是我的演示页面： http: //pwbguild.com/test/demo.html

向下滚动页面，您会注意到它不会更改为“关于”，直到您到达该部分的底部。

我知道问题出在“navbar-fixed-bottom”，因为如果我将其更改为顶部“navbar-fixed-top”，它似乎工作得很好。

谁能帮我理解为什么这在部分底部而不是部分顶部发生变化？

滚动间谍，你为什么不工作？我的身体没有 100% 的高度，我已经正确设置了我的数据属性并且可以理解你为什么不工作！

http://wildenmedia.com/index.php/products

我相信我正确地遵循了引导文档？

在这里混合两个元素有点问题！

我敢肯定你以前见过这种技术。位于功能区域下方的粘性导航栏，当用户向下滚动时，该导航栏会粘在页面顶部。当用户向下滚动页面时，导航栏会点亮相应的部分，用户也可以使用导航栏在部分之间跳转。

测试站点在这里：

http://www.domaincreative.co.uk/dev/midasflo-test2

scrollspy 引导元素似乎在滚动时效果很好。但是，一旦您单击某个区域，就会出现问题。通常它会转到错误的部分或在导航中突出显示错误的区域但在正确的部分。

有谁知道可以做些什么来解决这个问题？我的猜测是粘性导航可能导致高度问题？让它看起来比导航粘住时更短？

从本质上讲，它一直有效，直到粘性导航生效，让它们一起工作的解决方案是什么？