Question

我正在尝试使用两个div创建一个下拉菜单，第一个<div>具有.hover（）函数，显示第二个<div>。由于当我将鼠标指针移到第二个<div>上时，第一个div具有.hover（）函数，因此它会消失。

当我的鼠标指针超过第二个<div>时，如何禁用第一个<div>的.hover（）函数？

Answer 1

制作包含两个菜单div的包含div。当第一个菜单div悬停时，显示第二个div - 当包含div不再悬停时，隐藏第二个div。

希望这是有道理的：

    function show() {
    var elem = document.getElementById("secondmenu");
    elem.style.display = "block";
    }
    function hide() {
    var elem = document.getElementById("secondmenu");
    elem.style.display = "none";
    }

<div id="container" onmouseout="hide()"><div id="firstmenu" onmouseover="show()">this is the first menu</div><div id="secondmenu" style="display: none;">this is the second menu</div></div>

当鼠标位于<div> 1 </div> </div>之上时，保持<div> 2可见

1 个答案: