Question

I need to create a remove button that appear over my thumbs when a user hover that image with his mouse a link appear like remove from favorites?

Anyone know how to achieve this ?

An example of what I want is youtube quick list button you find over the videos thumbs.

Answer 1

This will show the icon when you hover the thumbnail, and when you hover the icon on top of that, it will change to a hover icon.

.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!