javascript - Bootstrap Scroll Spy 不起作用

Question

我正在尝试实现一个固定的侧边菜单，该菜单可以使用事件类更新事件页面链接。我将滚动 spy HTML5 元素放置在主体上，但遇到问题。有人可以检查我的 html 文件并看看他们是否可以确定问题所在并为我提供一些解决方案吗？

这是我的 github 帐户的链接:https://github.com/thlee1122/profile

这是 html 文件中当前导航部分的样子:

body data-spy="scroll" data-target="#navbar-example">
        <div class = "header">
            <div class = "container">
                <div class="video-section">
                    <video autoplay muted loop>
                        <source src="macbook.mp4" type="video/mp4">
                    </video>

                    <div class="section-content container">
                        <h1>Tae Hoon Lee</h1>
                        <hr></hr>
                        <h4>Interactive Portfolio</h4>
                        <!--<p><a class="btn" href="#">Email Me</a></p>-->
                    </div>
                </div>
            </div>
        </div>
        
        <div class="main" id="profile-intro">
            <div class="container">
                <h1>Profile</h1>
                <h3>I'm a creative Front end developer.</h3>
                <hr></hr>
            </div>
        </div>

        <div id="top" class="jumbotron">
            <a href="#profile" class="scroll-down">
                <span class="glyphicon glyphicon-chevron-down"></span>
            </a>

            <div class="navbar navbar-default" id="navbar-example" role="navigation">
                <div>
                    <div class="navbar-header"></div>
                    <div class="collapse navbar-collapse navbar-ex1-collapse">
                        <ul class="nav navbar-nav">
                            <li class="active">
                                <a href="#profile">Profile</a>
                            </li>

                            <li class>
                                <a href="#experiences">Experiences</a>
                            <li>
                            
                            <li class>
                                <a href="#skills">Skills</a>
                            </li>

                            <li class>
                                <a href="#projects">Projects</a>
                            </li>

                            <li class>
                                <a href="#contact">Contact</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
  </body>

Answer 1

我想我已经成功了!我将向您的 github 提交拉取请求。