鼠标悬停时切换 CSS - Wordpress 菜单

Question

我有一个 WordPress 菜单，其中每个菜单都链接一个自定义类。

鼠标悬停时，我希望此类更改页面中另一个元素的 css。

我尝试过但没有成功：

$('.menuclass').onmouseover(function () {$('.other-element').toggleClass("hover");});

我可能会走错路，你们有什么想法吗？

Answer 1

您的 jQuery 代码需要修改，因为 jQuery 使用 .on("mouseover", function() { ... }) 事件，而不是 .onmouseover。

修改后的代码如下：

$('.menuclass').on("mouseover", function () {
    $('.other-element').toggleClass("hover");
});

当鼠标悬停在具有 menuclass 类的元素上时，此代码会导致在 .other-element 中添加或删除悬停类。

此外，如果您希望当鼠标从元素上移除时移除悬停类，您可以使用 mouseenter 和 mouseleave :

$('.menuclass').on("mouseenter", function () {
    $('.other-element').addClass("hover");
}).on("mouseleave", function () {
    $('.other-element').removeClass("hover");
});