Bootstrap 4-Scrollspy无法正常工作 [英] Bootstrap 4 - Scrollspy not working
本文介绍了Bootstrap 4-Scrollspy无法正常工作的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我已经遵循了有关如何在BS4中使用Scrollspy的文档，但是它没有用，那么我该如何解决呢?
I have followed the documentation on how to use Scrollspy in BS4, but it is not working, so how do I solve it?
我的身体患有posistion: relative
这是我的身体标签:
<body data-spy="scroll" data-target=".navbar">
这是导航栏的HTML:
And this is the HTML for the navbar:
<nav class="navbar navbar-toggleable-md navbar-light bg-faded">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="container">
<a class="navbar-brand" href="/">
<img src="/images/logo_placeholder.jpg" width="90" height="45" class="d-inline-block align-top" alt="">
Jalinen
</a>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#home">Home </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Nieuws</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Diensten</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Calamiteiten</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Gallerij</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
为什么它不起作用?
注意:
atm无效.
导航栏甚至都不会停留在页面顶部.
The navbar doesn't even stick to the top of the page.
推荐答案
确保使用fixed-top将导航栏附加到顶部，
Make sure you're using fixed-top to attach the navbar to the top,
<nav class="navbar navbar-toggleable-md fixed-top navbar-light bg-faded">
..
</nav>
和body标签:
<body data-spy="scroll" data-target="#navbar1" data-offset="70">
在 Bootstrap 4.0.0
navbar-toggleable-md has changed to navbar-expand-lg in Bootstrap 4.0.0
这篇关于Bootstrap 4-Scrollspy无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
