1

在这个小提琴上，单击其中一个框后，悬停状态变为非活动状态并且不再显示。

我有三个使用 css 设置背景的框background-image。我正在使用 jQuery 来附加点击事件。你能帮我确定为什么悬停状态会停止工作吗？

谢谢。

4

3 回答 3

3

当 jQuery 更改背景图像时，它会这样做inline，因为它会修改实际的 HTML。这意味着新的背景图像比设置的更具体#one:hover，因此它不能覆盖它。

您需要!important在每个新背景图像之后添加，:hover以确保它具有覆盖它的特异性。

演示

于 2013-05-29T13:08:42.923 回答
2

因为 li 的内联样式会覆盖您的 css :hover 选择器属性。用于!important使其工作：

li#one:hover{
    background-image: url(http://i1287.photobucket.com/albums/a628/botpro7/1_hover_zps6b4b99c1.png)!important;
}
于 2013-05-29T13:08:42.717 回答
0

您遇到的问题是因为您使用 jquery 设置了与 css 属性内联的背景，我制作了一个演示来解决您的问题。

演示

我删除了插入背景的代码部分，并在.active您的代码中添加了一个类，因此当用户单击元素时，我在元素上设置了该类。我希望你喜欢！

于 2013-05-29T13:13:08.950 回答