Bootstrap scrollspy 结合点击事件

问题描述

index.html

<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top" id="nav">
  <button
    class="navbar-toggler"
    type="button"
    data-toggle="collapse"
    data-target="#navbarSupportedContent"
    aria-controls="navbarSupportedContent"
    aria-expanded="false"
    aria-label="Toggle navigation"
    id="bar_button"
  >
    <span class="navbar-toggler-icon"></span>
  </button>
  <div
    class="navbar-collapse collapse w-100 order-3 dual-collapse2"
    id="navbarSupportedContent"
  >
    <ul class="nav navbar-nav mx-auto">
      <li class="nav-item">
        <a class="nav-link hover select" id="Home">Home</a>
      </li>
      <li class="nav-item">
        <a class="nav-link hover" id="About">About</a>
      </li>
    </ul>
  </div>
</nav>

 <div class="home_style" id="home"></div>
 <div class="about_style" id="about"></div>

Javascript

    $("#Home").click(function () {
      $("html,body").animate(
        {
          scrollTop: $("#home").offset().top,},"slow"
      );
    });
    $("#About").click(function () {
      $("html,body").animate(
        {
          scrollTop: $("#about").offset().top,"slow"
      );
    });

如何将 scrollspy 添加到 javascript 以便在我滚动页面时,我的导航文本会改变颜色?

上面的javascript代码:点击时会滚动到div部分

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)