jquery-plugins – 如何激活Twitter Bootstrap Affix组件的链接?

前端之家收集整理的这篇文章主要介绍了jquery-plugins – 如何激活Twitter Bootstrap Affix组件的链接?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用Twitter Bootstrap Affix JS组件.当我向下滚动页面时,我的UL列表正确粘贴.另外 – 当我点击单个列表项(很像Twitter在其文档页面上)时,它会在我的文档中滚动到我的锚点ID,但LI元素不会收到Twitter的“活动”类.当我滚动文档时也不会得到“活动”类.

当我滚动到文档中的特定部分(很像滚动间谍作品)时,我会期望适当的链接处于活动状态,但我似乎无法让它工作.

有没有什么特别的,我需要设置,以便Bootstrap会在适当的时候添加“活动”类?

解决方法

是的,您还需要使用ScrollSpy插件.您可以通过标记或通过JS激活它.让#scroll-pane是触发滚动事件的元素,并且#navbar是包含ul.nav的元素,以下内容应该可以正常工作:

HTML

<div id="scroll-pane" data-spy="scroll" data-target="#navbar">

JS

$('#scroll-pane').scrollspy({target: '#navbar'});

使用HTML或JS,但不能同时使用.

附加信息

当ScrollSpy插件被传递给一个目标,比如scrollspy({target:’#navbar’})时,它被用来构造一个窗体的选择器

target + ' .nav li > a'

在这个例子中,这将给出

'#navbar .nav li > a'

了解此选择器创建的规定很重要.

>原始目标必须是包含类nav的元素的元素.所以,不应该是你的目标.
> .nav元素必须包含列表项.
>这些列表项必须具有< a>作为一个直接的孩子.

< a>然后由其选择的元素由数据目标或href以’#’开头的那些过滤掉.这些href依次用于选择包含在ScrollSpy插件附加到的元素中的元素.存储所选择的偏移量,并且当滚动发生时,对存储的值进行当前滚动偏移的比较,更新相应的< a>元素与类活动.

希望本摘要可以帮助您更好地了解在尝试实现插件时可能会跳过什么,而无需进一步详细了解代码.

猜你在找的jQuery相关文章