将鼠标悬停在href img src上?

时间:2012-11-05 00:04:53

标签: hover image href

嘿,我已经尝试了一段时间,但没有运气。 我有以下代码:

<a href="iframelink opened in fancybox"><img src="image link"></a>

如何将图像悬停在img src上?感谢

1 个答案:

答案 0 :(得分:0)

使用背景图片而非<img>标记的示例。

<a href="...." rel="fancybox"><a>

CSS:

a[rel=fancybox] {
  display: block;
  background: url('image1.jpg') no-repeat 0 0 transparent;
  width: 100px; 
  height: 100px;
}

a[rel=...]:hover {
  background: url('image2.jpg') no-repeat 0 0 transparent;
}

您可能需要预先加载图片。

使用JS:

<a href="" rel="" onmouseover="this.getElementById('i1').src='/images/image_hover.jpg'" onmouseout="this.getElementById('i1').src='/images/image.jpg'">
<img id="i1" src="/images/image.jpg">
</a>