将鼠标悬停在图像/链接/其他div上后如何显示DIV？

Question

我以前做过这件事，但遗憾的是我已经忘记了。我用简单的CSS做到了，所以不应该使用javascript或jquery。我想要的只是A显示，B显示当你将鼠标悬停在A上时。

另外，如果你可以，在你告诉我如何做以上之后你还能告诉我如何在隐藏的div上使用滑动动画吗？所以当你将鼠标悬停在A上时，B会滑入？

Answer 1

这是一些在IE 6中不起作用的纯CSS。它涉及在链接和框（#outer）周围包装容器#tooltip。当然，在实际应用中，您可能希望使用绝对定位来定位框。

#tooltip {
    display: none;
}

#outer:hover #tooltip {
    display: block;
}

HTML（try it）：

<div id="outer">
    <img src="http://www.google.com/images/logos/ps_logo2.png">
    <div id="tooltip">Hello, world!</div>
</div>

对于动画，你最好使用jQuery或其他JS库，因为浏览器对CSS3动画的支持目前很差。