如何在用户查看页面的特定部分时更改导航栏图标的颜色

Question

我在 android 上有一个看起来像这样的导航栏

点击后会出现以下链接

<a href="#body-heading" class="nav__link  nav__link--active">
<a href="#services" class="nav__link">
<a href="#images" class="nav__link">
<a href="#" class="nav__link">

所以我想要的是，如果有人在 android 上查看 ID 为 #services 的元素，我需要 js 或 css 来切换 class nav__link--active 从主页图标并将其添加到服务图标。我想对导航图标中的每个图标都这样做。有什么办法可以在 js 或 css?

上执行此操作

Answer 1

这是适合您的解决方案

<pre>
     https://codepen.io/lasjorg/pen/ZEQpKqy
</pre>

如何在用户查看页面的特定部分时更改导航栏图标的颜色

How to change the color of navbar icon when the user is viewing a specific section of page

html

javascript

css

android

nav