使用删除图像按钮叠加缩略图？

Question

当用户用鼠标悬停该图像时,我需要创建一个显示在我的拇指上的删除按钮,链接显示为从收藏夹中删除？

谁知道如何实现这一目标？

我想要的一个例子是你在视频大拇指上找到的youtube快速列表按钮.

http://i50.tinypic.com/fxdu2b.jpg

Answer 1

这将在您悬停缩略图时显示图标,当您将图标悬停在其上时,它将变为悬停图标.

.image-thumb, .image-thumb img {
  position:relative;
  width:60px;
  height:50px;
}
.image-fav {
  display:none;
  position:absolute;
  bottom:0;
  left:0;
  width:15px;
  height:15px;
  background-image:url(normal_plus.png);
}
.image-thumb:hover .image-fav {
  display:block;
}
.image-fav:hover {
  background-image:url(hover_plus.png);
}

<div class="image-thumb">
  <img src="thumb.jpg" />
  <a href="#" class="image-fav"></a>
</div>

Booya!