在缩略图上显示鼠标上的链接图像

Question

这是我的缩略图和相关大图片的HTML代码。当我点击缩略图时它将显示大图像，但我希望这发生在onmouseover上。我的意思是当我将光标放在缩略图上时，它应该显示大图像。我该怎么转换呢。

我的HTML代码：

<ul class="thumbnails mainimage">
            <li>
              <a  rel="position: 'outside' , showTitle: false, adjustX:-14, adjustY:-560" class="thumbnail cloud-zoom" href="img/category1/sub1/1_big.jpg">
                <img src="img/category1/sub1/1.jpg" alt="" title="">
              </a>
            </li>
            <li>
              <a  rel="position: 'outside' , showTitle: false, adjustX:-14, adjustY:-560" class="thumbnail cloud-zoom" href="img/category1/sub1/2_big.jpg">
                <img  src="img/category1/sub1/2.jpg" alt="" title="">
              </a>
            </li>
</ul>

Answer 1

使用CSS伪类:hover。

.thumbnail:hover {
   background: url('/path/to/myImage.png')
}