Ana Sayfa » Html-Css » Gölge Ve Genişleyen Resim Ekelntisi

17 Mayıs 2013 Cuma
tarihinde yazıldı

Gölge Ve Genişleyen Resim Ekelntisi

Yazan: Burak ÇakırYazar bilgileri | Kategori : Html-Css | Yorum : Yorum Yok

Çok harika bir eklenti olan gölge efekti ve ardından genişleme efekti ile birleşmiş olan bu eklenti bir çok blog da bulunmaktadır.Çok hoş bir eklentidir kullanılması kolay ve görüntü kalitesini güzelleştiren bir kod ile sitenizi güzelleştirmek istemez misiniz ?.Sizler için araştırdım güzel bir eklenti olması dileği ile sunuyorum hemen koda geçelim ;









CSS :
.MBT-CSS3 img{ -webkit-transform:scale(0.7); /*Webkit 0.7 times the original Image size*/ -moz-transform:scale(0.7); /*Mozilla 0.7 times the original Image size*/ -o-transform:scale(0.7); /*Opera 0.7 times the original Image size*/ -webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/ -moz-transition-duration: 0.5s; /*Mozilla Animation duration*/ -o-transition-duration: 0.5s; /*Opera Animation duration*/ opacity: 0.5; margin: 0 10px 5px 0; } .MBT-CSS3 img:hover{ -webkit-transform:scale(1.1); /*Webkit: 0.5 times the original Image size*/ -moz-transform:scale(1.1); /*Mozilla 0.5 times the original Image size*/ -o-transform:scale(1.1); /*Opera 0.5 times the original Image size*/ box-shadow:0px 0px 30px gray; -webkit-box-shadow:0px 0px 30px gray; -moz-box-shadow:0px 0px 30px gray; opacity: 1; }
HTML :

<div class="MBT-CSS3"><img src="Resim Urlsi" /></img></div>

Sponsor Ol
Ayrac

Yorum yapın

Lütfen konu ile alakalı yorumlar yapmaya özen gösterelim.