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

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的伪class :hover

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