小编Kai*_*ine的帖子

Bootstrap Scrollspy不起作用:Scrollspy不是函数

我正在制作一个页面的网站,并且试图获取导航栏链接以反映您所在页面的哪个部分。我尝试通过HTML使用它,但没有成功。我在包含我的不同部分的容器上有此代码

<div class="container" data-spy="scroll" data-target="#navbar">
Run Code Online (Sandbox Code Playgroud)

并将身体设置为相对。

由于这不起作用,我尝试将Scrollspy与javascript一起使用

$('.container').scrollspy({ target: '#navbar' })
Run Code Online (Sandbox Code Playgroud)

也没有运气。我在引导CDN之前有jQuery CDN,但是在控制台中收到此错误。未捕获的TypeError:$(...)。scrollspy不是函数

CodePen:https://codepen.io/kjardine/pen/VqEbaz

html javascript scrollspy

3
推荐指数
2
解决办法
2043
查看次数

Bootstrap 粘性顶部导航栏在滚动时消失

导航栏粘在顶部,直到我滚动出英雄图像然后消失。我希望导航栏出现在整个页面中。有任何想法吗?

<nav class="navbar sticky-top navbar-expand-lg navbar-dark bg-dark">
        <div class="collapse navbar-collapse">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item active">
                    <a class="nav-link" href="#home">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#about">About Me</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#projects">Projects</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#contact">Contact Me</a>
                </li>
            </ul>
        </div>
    </nav>
<!--Navbar end-->

<!-- Homescreen hero -->
    <div class="hero-image" id="home">
        <div class="hero-text">
            <h1 class="name">Text</h1>
            <h1>Text</h1>
        </div>
    </div>
Run Code Online (Sandbox Code Playgroud)

html css twitter-bootstrap bootstrap-4

2
推荐指数
1
解决办法
5025
查看次数