Javascript 菜单悬停效果照亮整个rest页面

请让我知道如何使菜单悬停效果像以下网站：

我建议您使用addClass和CSS：

这需要添加CSS规则来设置不透明度的样式：

ul:hover li {
    opacity: 0.4;
}

ul li.hovered {
    opacity: 1;
}

顺便说一句，如果你能在解决自己的问题上做出一些努力，你可能不会得到那么多的反对票。它实际上是一种需求，而不是当前编写的问题

当然，您可以使用简单的CSS：

ul:hover li {
    opacity: 0.4;
}

ul li:hover {
    opacity: 1;
}

.

覆盖效果

在感兴趣的站点上，当您将鼠标移到导航链接（例如主页）上时，页面会变暗/变暗

这种影响是以下因素的结果：

<span class="overlay" style="height: 2464px; display: none;"></span>

诀窍相当简单，分两步

1显示覆盖元素

2更改导航元素和下拉类的z索引，使菜单在覆盖上方可见

覆盖更接近视图z索引比网站的其余部分高，因此其背景色遮罩/暗显网站的其余部分，但沿z轴向上移动的导航元素除外

---

现在您知道要查找什么了，您可以研究CSS和jQuery的详细信息，以了解如何在另一种情况下实现它。

您确实需要花更多的时间写出您的问题，并提供一个带有CSS的html示例。非常感谢您的回答，很抱歉没有详细提问，我编辑了你的小提琴只有一个问题我怎么能调暗页面的其余部分目前只有菜单选项变暗你要求很多免费工作。。。有人要赏金吗？在要求更多工作之前，试着投票表决我的答案。我不能提供任何赏金。我得到的只是14个代表：，我可以给你我的14个代表分数吗？我希望其他人会看到这一点…仍然感谢你花时间研究我的问题：我在这方面做了一些工作，但jQuery有点棘手，我没有时间把它全部整理出来，并免费编写产品质量代码。祝你好运

ul:hover li {
    opacity: 0.4;
}

ul li:hover {
    opacity: 1;
}

<span class="overlay" style="height: 2464px; display: none;"></span>

/*Over Lay Display controll in bottom*/
$(document).ready(function() {
$(" ul.mainNav li.home").mouseover(function() {
$(".overlay").css({'display':'block'});
$(" ul.mainNav").css({'z-index':'8'});
$(" .dropDown").css({'z-index':'8'});
})
});