Javascript 是否更改页面滚动上的活动导航图像？

我正在尝试复制一个类似于此网站上使用的导航栏：。我要寻找的主要效果是，当页面上到达正确的锚点时，每个图像都会变为活动状态

我已经通过文本看到了这一点，我还创建了一些图像，并使用以下CSS在图像激活时再现“更改颜色”效果：

#mainmenu a img {
     position: relative;
     margin-bottom: -30px;
     margin-top: 5px;
}

#mainmenu a img:hover, #mainmenu a img.active{ 
     top: -31px;
}

---

我遇到的问题是替换jfiddle中的代码，使其能够处理图像而不是文本。如果有人能帮忙，那就太好了

您可以在任何元素上使用

id

，它可以是

或

---

在菜单中，

我是否明白了这个想法并不重要，但我看不到如何让它与我的代码一起工作。以下是它的精简版本：。悬停效果有效，但图像没有应用活动CLA。@user3477755您没有加载jQuery框架，也没有正确编写选择器。课堂活动设置为li，而不是你小提琴的img更新：谢谢，太好了！我开始思考这个问题。在看了其他的例子之后，活动应该在Li上，但是我不知道。Active可以放在选择器的中间。现在让它与我的网站一起工作，在jsfiddle上它与“onload”一起工作，但与我现在遇到的问题无关。我想它与CSS选择器有关，而且，是的，我忘记了，在你的脚本中，你在标签中查找href，而不是img标签……在jsfiddle中它工作正常，在我的网站上，我仍然无法让它工作。太近了！