javascript - 我怎样才能用 css 和/或 javascript 做到这一点？

Question

这是代码：

HTML：

<img src="..." />

// other stuff 

<div id="image">
<a href="" > bla bla bla </a>
<a href="" > ble ble ble </a>
</div>

CSS：

#image a:hover{color:green;}

我要这个：

当用户将鼠标放在图像上时，id 为“image”的 div 中的所有链接都会变为绿色（就像用户将鼠标放在链接上一样。）。

如果可能的话，我更喜欢只使用 CSS。

score 7 · Accepted Answer

7

img:hover + #image a {
    color: green;
    text-decoration: none;
}

于 2013-05-01T16:42:30.313 回答

score 3 · Accepted Answer

img:hover + #image a{color:green;}

:hover尽管在使用with 方面存在一些浏览器怪癖+，因此您需要进行一些测试，看看您支持的浏览器是否受到影响。

当然+，旧浏览器也不支持。

如果两者之间有一个元素，则可以~改用。

img:hover ~ #image a{color:green;}

score 1 · Accepted Answer

@xRobot，您的小提琴的问题是您没有引用的兄弟姐妹#topimg，这table不是tr#image. 您引用的元素是 table 元素的子元素，也是 #topimg 元素的侄女（不是兄弟）。

检查这个更新的小提琴：http: //jsfiddle.net/QSy9H/32/

...并使用此页面上的示例：

img:hover ~ table #image a{ color:green; }

3 回答 3