Question

我正试图在悬停后用另一张图片上的图像解决我的问题。

我发现了这个：http://demo.fearlessflyer.com/html/demo/pretty-hovers/，但我无法从中删除标题。

我目前的代码非常简单：

HTML：

<div id="gallery">
<img src="img/w.jpg" alt="" />
<img src="img/sr.jpg" alt="" />
<img src="img/as.jpg" alt="" />
</div>

CSS：

#gallery  img { width: 160px; height: 160px; padding: 4px; border: 1px #666 solid; }

我想避免在HTML代码中放置任何容器，范围，类等。我更喜欢在CSS / JS源代码中使用它。

我想要类似的效果：

http://oi44.tinypic.com/eq6phd.jpg

感谢您的回复。

问候。

Answer 1

是否有特殊原因迫使您避免使用div元素？虽然我相信没有这些可行，但我怀疑你会找到一个“好”的解决方案。我可能会尝试类似的东西：

HTML：

<div id="gallery">
 ...
 <div id="DivToHover1"><img id="imgToHide" src="yourTransparentPicture"/></div>
 ...
</div>

css：

...
#DivToHover1 {
  height: "your picture height";
  width: "your picture width";
  background-image:url("yourpicture");
}

#imgToHide {
  display:none;
}
...

JS：

...
$("#DivToHover1").hover(function() {
  $("#imgToHide").show();
  //do some more funky stuff
});
...

在另一个图像上的透明图像作为悬停

1 个答案: