如何在悬停子菜单时保持悬停状态？

Question

我试图让按钮处于悬停状态，而光标仍在子菜单中，但无法弄清楚。真的需要帮助！谢谢！

function hideAllCat() {
    $("#categories").hide();
}

hideAllCat();

$("#tab50").mouseover(function(){            
    hideAllCat();
    $("#categories").slideDown();
});

$("#categories").mouseleave(function() {
    hideAllCat();
});

http://jsfiddle.net/G5RtR/24/

Answer 1

您的#tab50元素不是#categories元素的父元素，因此您无法使用伪类:hover。 :hover仅在对象位于鼠标箭头下方时才有效。话虽这么说，你现在有2个（++）可能的解决方案。

1. 将#tab50父级设为#categories。当子菜单扩展时，＃tab50也会相应扩展。
2. 使用javascript完成工作。 $("#categories").mouseover(function({$("#tab50").css({'background':'#abc','color':'red'})}); 请记住在#tab50
中将$("#categories").mouseleave();的颜色更改回正常状态

注意：

• #categories应该是class而不是id，因为hideAllCat()应该隐藏所有categories，并且一个不能超过id <!--=include partials/header.html --> 在一个html文件中。