Cara Membuat Efek Membesar Pada Gambar Saat di Sentuh Mouse

Oleh Bardil

19 Juni, 2014

Bagikan :

Tweet

Postingan kali ini yaitu Cara Membuat Efek Membesar Pada Gambar Saat di Sentuh Mouse. Anda pasti pernah melihat gambar dengan efek yang keren-keren di blog atau website orang, dengan bermacam-macam efek yang cool seperti membesar, memutar ataupun sudut gambarnya menumpul. Jika anda ingin mencobanya silahkan ikuti caranya dibawah ini.

1. Sepeti biasa login dulu ke blogger anda

2. Pilih edit HTML

3. Tekan ctrl+f (untuk memudahkan pencarian) lalu copy berikut tepat diatas ]]></b:skin>

.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.3); -o-transform: scale(1.3); -webkit-transform: scale(1.3); } .post img:hover{-o-transform: scale(1.2) rotate(360deg) translate(0px);-moz-transform: scale(1.2) rotate(360deg) translate(0px);-webkit-transform: scale(1.2) rotate(360deg) translate(0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}

Ø Kode diatas itu adalah untuk efek membesar, sedangkan untuk efek membesar sekaligus berputar copy kode berikut tepat diatas ]]></b:skin>  

.post img{-o-transition: all 1s ease;-moz-transition: all 1s ease;-webkit-transition: all 1s ease;} .post img:hover{-o-transform: scale(1.2) rotate(360deg) translate(0px);-moz-transform: scale(1.2) rotate(360deg) translate(0px);-webkit-transform: scale(1.2) rotate(360deg) translate(0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}

Tag : Belajar menjadi bloger keren