问题标签 [scrollspy]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
twitter-bootstrap - 贴顶部导航栏滚动间谍问题，页面内容覆盖
我有一个最初不固定在顶部的导航栏，我在这里尝试做的是，当我滚动偏移量为 150 像素时，导航栏以固定位置固定在顶部，它使用页面内锚链接到页面的不同部分，顶部固定的词缀导航栏将突出显示页面锚区域中的正确（scrollspy？）
我的问题是，在导航栏固定到顶部后，固定导航栏会阻止锚点指向页面上的正确位置，因为某些内容隐藏在导航栏后面。
我已经对这个问题进行了相当长的研究，并看到了很多关于向 body 添加 padding-top 的建议，但同样，top-nav 直到通过滚动触发后才会修复。向正文添加填充后，导航仍然无法正确突出显示
我已经尝试了以下部分的解决方案 如何在 Bootstrap 中设置 ScrollSpy 的偏移量？
我不擅长解释，所以我将在这里发布一些屏幕截图。
这是滚动和附加之前的屏幕截图
这是导航栏固定到顶部后的屏幕截图，我滚动到页面内容
我希望它如何工作
下面是我的代码。
这是内容区
其余的 html 只是包含在 section2、section3 和 section4 中的内容
我的 CSS
JS
twitter-bootstrap - Bootstrap scrollspy 不适用于 HAML
我正在尝试scrollspy从 Bootstrap 库中实现。当前，我手动激活的选项卡保持活动状态，nav如果我滚动或单击，则没有任何更改。我有以下。有任何想法吗？
jquery - 在滚动间谍处激活选项卡菜单
我第一次增加句子。我做了一个间谍卷轴来引导。基本功能没有问题。但是，用鼠标滚轮进行显示时，选项卡菜单的激活时间分别不同。比如有一个名为A的选项卡菜单，还有一个名为B的选项卡菜单，以及假设有B和A的标题，当鼠标滚轮时，A选项卡菜单，这个参数会影响上面的标题A的激活，选项卡菜单B的激活在上面的标题B已经改变了。我想解决这个问题。
jquery - 如何使用 Bootstrap ScrollSpy 在 body 上使用多个目标
我想将 Bootstrap ScrollSpy 与多个导航、我的主导航和垂直子导航一起使用。
我尝试了多种方法，例如：
<body data-spy="scroll" data-target="#main-nav #subnav"><body data-spy="scroll" data-target="#main-nav, #subnav">$('body').scrollspy({target: "#main-nav"});
$('body').scrollspy({target: "#subnav"});$('body').scrollspy({target: "#main-nav"}, {target: "#subnav"});- 放置包装器div：
<body data-spy="scroll" data-target="#main-nav"><div data-spy="scroll" data-target="#subnav">
但没有任何工作正常...
我怎样才能做到这一点？
谢谢！
javascript - 重新初始化 scrollspy angularStrap
我正在使用来自AngularStrap的 scrollspy在滚动时显示当前月份。启动 scrollspy 的标题循环：
被监视的元素是表格行：
这一切都很好，直到我远程添加更多的几周和几个月。scrollspy 不适用于新添加的元素，而生成的 html 看起来不错。在 scrollspy 模块 ( GitHub ) 中，spy 使用 $scrollspy.init 启动。我想我必须使用 $scrollspy 服务再次重新初始化 scrollspy，但我无法让它工作。谢谢
jquery - Bootstrap 词缀类在底部跳跃
我已经设法让 scrollspy 和 affix 插件正常工作，但是每当用户滚动到页面底部（如果使用小浏览器窗口）时，词缀类就会开始与另一个类发生冲突，并且词缀会在状态之间跳转。
可以在这里看到一个例子：http: //devng.sdss.org/results-science/
CSS是：
和 JS：
我认为答案就在我面前，但我已经盯着这个太久了，任何额外的眼睛都会非常感激。
twitter-bootstrap - 防止 Bootstrap scrollspy 添加 URL 哈希
我已经实现了 Bootstrap 3.0 的 scrollspy，如下所示：
我正在像这样初始化它：
它在li您滚动时按预期设置活动，还允许使用链接导航到部分。问题是，当您单击链接时，它会将链接附加到哈希中的 URL，例如。mysite.com/#previewDisplay。我根本不想更改 URL。
我以前在我相信的选项卡中遇到过这个问题，我忘记了解决方案是设置data-parent还是添加这样的点击事件：
添加data-parent与滚动间谍无关，就像标签一样，上面的点击事件导致链接无法导航。
提前致谢。
javascript - Bootstrap scrollspy 一直有效，直到我单击 header/nav 链接
我正在尝试将 scrollspy 用于我的固定标题导航，并且在我最初加载页面时它可以正常工作。
但是，如果我单击标题中的一个链接以跳转到该部分，那么当我滚动经过它的页面时，我刚刚单击的那个链接将不再显示为活动的。所有链接都以这种方式运行，我不知道为什么它们最初会起作用，但一旦单击就会停止工作。
...
...
此外，如果我刷新页面，它会再次恢复正常工作。
twitter-bootstrap - 内容标题隐藏在 bootstrap scrollspy 后面
我所需要的是，当您单击相应的链接（例如关于我们等）时，它应该显示内容的标题，但到目前为止，标题隐藏在导航菜单后面。请帮助我减少项目的时间。如果我将填充添加到#section，它看起来是正确的，但在全宽图像之后的页面顶部会留下我不想要的空白。
下面是网址
jquery - Jquery ScrollSpy - 在示例文件中工作 - 当我这样做时不起作用
我正在使用以下脚本，它允许您检测元素何时进入和离开您的视点：https ://github.com/thesmart/jquery-scrollspy
作者提供的示例效果很好，下面是它的代码：
这部分基本上创建了屏幕上的所有元素：
这是所有元素的样式：
这是检查元素何时进入和离开视点的 ScrollSpy 脚本：
到目前为止，一切都很好，示例文件中的所有内容都可以正常工作。现在我试图做的是手动输入我自己的元素：
然后使用相同的 ScrollSpy 代码，但更新以查看是否可以获得相同的结果：
由于某种原因，这不起作用。现在，如果我使用由第一个脚本生成的 #tile-220 而不是 #tile-90，它会很好用，只是不用我手动添加的 ID。谁能帮我弄清楚我错过了什么？
非常感谢您！