如何更改一个元素，而徘徊在另一个
我已经看了几个其他的问题，但我似乎无法找出他们中的任何一个，所以这里是我的问题，我想有一个div或跨度，当你将鼠标hover在它上面会出现一个区域，就像一个下降下。
比如我有一个div，我想把它hover在上面，让它显示一些关于我hover的项目的信息
<html> <head> <title>Question1</title> <styles type="css/text"> #cheetah { background-color: red; color: yellow; text-align: center; } a { color: blue; } #hidden { background-color: black; } a:hover > #hidden { background-color: orange; color: orange; } </styles> </head> <body> <div id="cheetah"> <p><a href="#">Cheetah</a></p> </div> <div id="hidden"> <p>A cheetah is a land mammal that can run up 2 60mph!!!</p> </div> </body> </html> 但这似乎不工作，我不知道为什么…如果有办法做到这一点在CSS中，我想知道，但我想任何和所有的build议。
只有当隐藏的div是用于hover的元素的子元素时，才可以在CSS中实现：
您不能使用以下方法来影响非子元素:hover从所有常用浏览器支持的CSS2中进行:hover 。
您可以使用CSS2.1select器来影响同级元素，如下所示：
a:hover + .sibling { ... }
但是，这只适用于直接兄弟姐妹 。 这意味着你可以有这样的HTML：
<p><a href="#">Cheetah</a> <span class="sibling">Blah Blah Blah</span></p>
注意a和span是直接的兄弟姐妹。
这是一个小提琴显示兄弟姐妹工作： http : //jsfiddle.net/vUUxp/
然而， 并不是所有的浏览器都支持CSS2.1兄弟select器 ，所以如果你可以使用这个select器 ，你需要根据你的目标受众来决定。
编辑 ：纠正了+select器的CSS版本我的错误：2.1定义它，而不是CSS3。 我还添加了显示浏览器支持的链接。 否则，答案是一样的。
或者，如果你打开它，使用jQuery 。
像这样的东西可以工作：
$("#element") // select your element (supports CSS selectors) .hover(function(){ // trigger the mouseover event $("#otherElement") // select the element to show (can be anywhere) .show(); // show the element }, function(){ // trigger the mouseout event $("#otherElement") // select the same element .hide(); // hide it });
请记住，将其包装在一个DOM准备函数（ $(function(){...});或$(document).ready(function(){...}); ）中。
