I\'m currently creating a image gallery (using Zurb Foundation as Framework) and would like to show the zoom icon on image hover (like this example here: http://codepen.io/Twiki
I've put a quick JSfiddle together using font-awesome. The CSS is hacked together but demonstrates what's possible. It should give you a starting point to experiment with.
<a href="#" title="" class="image">
<img src="http://www.lyricis.fr/wp-content/uploads/2010/04/kickass-film-still-01.jpg" alt="">
</a>
<div class="cn">
<div class="inner">
<a href="#zoom"><i class="icon-zoom-in large"></i></a>
<a href="#download"><i class="icon-cloud-download large"></i></a>
<a href="#comment"><i class="icon-comment large"></i></a>
</div>
</div>
Note: The JSfiddle above uses font-awesome.css called externally from bootstrapcdn.com