Şu anda bir resim galerisi oluşturuyorum (Resim olarak Zurb Foundation'i kullanarak) ve resmin yakınlaştırma/zoom oranını göstermek istiyorum (bu örnekteki gibi: http://codepen.io/Twikito/pen/Jeaub). Ancak ikonun bir yazı tipi (Font Awesome) simgesi olmasını ve sadece bir tane de 3 ayrı tıklanabilir ikon olmasını istemiyorum. Bu mümkün mü?Font Awesome Image Overlay
7
A
cevap
22
Mümkün!
Yazı tipi-harika kullanarak birlikte bir quick JSfiddle koydum. CSS birbirine saldırıldı ancak neyin mümkün olduğunu gösterir. Denemek için size bir başlangıç noktası vermelisiniz.
<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>
Not: JSfiddle yukarıda bootstrapcdn.com
harici olarak adlandırılan yazı-awesome.css kullanır