Javascript onMouseOver 和 onMouseOut 显示和隐藏 div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7456232/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
onMouseOver and onMouseOut show and hide div
提问by user44444444
Ok what I want is when the user moves the mouse pointer over a certain divit should appear. And when the mouse leaves the divthat divshould disappear. This is what I have done so far.
好的，我想要的是当用户将鼠标指针移动到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'">
But my problem is that when the mouse leaves the divit disappears but when I again go over the divit does not appear. How can I fix that ?
但我的问题是，当鼠标离开时div它会消失，但当我再次经过时div它不会出现。我该如何解决？
回答by Will
When you hide the div, you will not be able to mouseover it again. That is usually the point of hiding an element, so that clients cannot access it. One thing you can do is add a container and attach the mouseover event to the container.
当您隐藏 div 时，您将无法再次将鼠标悬停在它上面。这通常是隐藏元素的目的，以便客户端无法访问它。您可以做的一件事是添加一个容器并将鼠标悬停事件附加到容器。
<div onmouseover="document.getElementById('center').style.visibility = 'visible'">
<div id="center" onmouseout="this.style.visibility = 'hidden'">
</div>
</div>
回答by TheWiseG
Try like this:
像这样尝试：
<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">
I added a background color to the div and some dimension because if the div has nothing inside and no costraints for the dimension it collapse.
我为 div 和一些维度添加了背景颜色，因为如果 div 内部没有任何内容并且维度没有约束，它就会崩溃。
Hope this is useful
希望这是有用的
