CSS Filtre ile resimlere zoom efekti

Bu yazımızda CSS’te filtre kodlarını kullanarak resimlere zoom efekti vereceğiz..
Yazılarıma yapılan yorumlarda, iletişim adresime gelen mesajlarda blogumda kullandığım, resimlerin üzerine gelince zoom efekti isteniyordu..
Bende siz değerli takipçilerimle paylaşmak istedim :)

Kodlara geçmeden önce şunu belirteyim, aşağıda verdiğim kodları Şablon > HTML’yi Düzenle dedikten sonra Ctrl+F tuş kombinasyonu yardımıyla kolayca bulabileceğiniz ]]></b:skin> kodunun üstüne ekleyeceksiniz.


.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);
}

Share on Google Plus

About Unknown

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.
    Blogger Comment
    Facebook Comment

0 yorum :

Yorum Gönder