jquery - 如何对多个背景图像使用CSS过渡

对于背景图像有一个图像翻转，并且由于我有多个图像，我想知道如何为多个图像重用相同的#Rollover？

<div id="leftprod"><a href="product.php" id="myRollover" ></a></div>


#Rollover {
 background-image: url('images/mood160-1.jpg');
 width: 160px;
 height:207px;

 position: absolute;

}

#Rollover:hover {
 background-image: url('images/mood160-2.jpg');
 width: 160px;
 height:207px;
 border: solid 0px #676767;

}

最佳答案

目前您有<a id="Rollover">

更改它以使用类而不是这样的ID

<a class="rollover">

然后，您可以使用以下CSS：

.rollover:hover {
 background-image: url('images/mood160-2.jpg');
 width: 160px;
 height:207px;
 border: solid 0px #676767;
}

这会将翻转应用于具有rollover类的任何对象

ID和类之间的主要区别在于，您只应使用一次ID，因为要将滚动影响应用于多个元素，因此应使用类。

关于jquery - 如何对多个背景图像使用CSS过渡，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/8747538/