CSS İle Resimlerinize Zoom Efekti Verin

                                                      CSS İle Resimlerinize Zoom Efekti Verin
Merhaba arkadaşlar son zamanlarda blogumda kullandığım bir çok eklentiyi siz değerli takipçilerim ile paylaşmaya başlamıştım bugünkü yazımda ise sizlere blogumda aktif olarak kullandığım ve resimlerin üzerine gelince hafif büyüyen yani zoom efektinin nasıl yapıldığını ve nasıl kullanabileceğinizi anlatacağım. Kullanımı ve kurulumu oldukça basit olan bu eklenti ile sizde blogunuza zarif ve güzel bir görüntü sağlayacaksınız. Bu yazımda Blogger altyapısında olan bloglar için nasıl kullanıldığını anlatacağım.
Öncelikle Şablon->HTML'yi düzenle ye girdikten sonra CTRL+F yardımı ile aşağıdaki kodu bulalım;

]]></b:skin>

Bulduktan sonra hemen üstüne aşağıda vermiş olduğum kodu ekleyelim;

.post-body img { 
-webkit-transition: all 0.3s ease-in-out; 
-moz-transition: all 0.3s ease-in-out; 
-o-transition: all 0.3s ease-in-out; 
-ms-transition: all 0.3s ease-in-out; 
transition: all 0.3s ease-in-out; 
}
.post-body img:hover { 
-webkit-transform: scale(1.1); 
-moz-transform: scale(1.1); 
-o-transform: scale(1.1); 
transform: scale(1.1); 
}

Hepsi bu kadar arkadaşlar artık resimlerinizin üstüne gelindiğinde zoom efekti aktif olarak kendini göstermeye başlayacak, yapamayan arkadaşlar yorum formunu kullanırlarsa yardımcı olurum. Görüşmek üzere..