Question

好的我想要的是当用户将鼠标指针移动到它应该出现的某个div上时。当鼠标离开时div div应该消失。这是我到目前为止所做的。

<div id="center"  style="position:absolute; left:45%; top:35%;" onMouseOver=" document.getElementById('center').style.visibility = 'visible'" onMouseOut="document.getElementById('center').style.display = 'none'">

但我的问题是，当鼠标离开div时，它会消失，但当我再次越过div时，它就不会出现。我该如何解决这个问题？

Answer 1

当您隐藏div时，您将无法再次鼠标悬停。这通常是隐藏元素的关键，因此客户端无法访问它。您可以做的一件事是添加容器并将mouseover事件附加到容器。

<div onmouseover="document.getElementById('center').style.visibility = 'visible'">
    <div id="center" onmouseout="this.style.visibility = 'hidden'">
    </div>
</div>

Answer 2

试试这样：

<div id="center"  style="position:absolute; left:45%; top:35%;background-color:#03C;width:400px;height:400px;opacity:0;" onMouseOver="document.getElementById('center').style.opacity = 1" onMouseOut="document.getElementById('center').style.opacity = 0">

我为div和某个维度添加了背景颜色，因为如果div内部没有任何内容，并且没有尺寸的折扣，则会折叠。

希望这很有用

onMouseOver和onMouseOut显示并隐藏div

2 个答案: