javascript - 更改 materialize scrollspy 函数的默认外观

Question

我正在使用 materializecss我网站的框架。我正在为导航栏使用 scrollspy 函数。但我想将红色的默认颜色更改为白色，并将导航链接下方的垂直线更改为水平线。

现在我有了这个

我想要的是

scrollspy函数的JS代码。

      $(document).ready(function(){
      $('.scrollspy').scrollSpy();
      });

我不知道要更改哪些特定类。

Answer 1

如果您不想在您的网站上使用副目录，您可以更改目录类的 css。

进入materialize.css文件，找到如下代码:

  .table-of-contents a.active {
    font-weight: 500;
    padding-left: 18px;
    border-left: 2px solid #ea4a4f;
  }

然后你可以用这个替换它:

  .table-of-contents a.active {
    font-weight: 500;
    padding-left: 18px;
    border-bottom: 2px solid white;
  }

要查看结果，您必须在 html 中链接 materialize.css 文件而不是 materialize.min.css。在生产环境中，您需要最小化修改后的 materialize.css 文件。

也许有点晚了，但我希望它能有所帮助。