Cara Membuat Gambar Postingan Berputar-Putar Di Blog

Ingat !!! Sebelum kamu mengedit HTML, sebaiknya BACKUP dulu template blog kamu.

Cara Membuat Gambar Postingan Berputar-Putar Di Blog merupakan salah satu trik untuk membuat gambar yang ada di blog berputar 360 derajat apabila ada kursor mouse yang mendekat. Trik ini hanya menggunakan kode CSS tanpa harus menggunakan javascript atau jQuery sehingga sangat mudah untuk diaplikasikan di blog. Sebagai contoh seperti yang ada dipostingan artikel ini apabila kursor mouse berada diatas gambar maka gambar akan berputar 360 derajat... Oke dech biar ga kelamaan langsung aja ke TKP mazbro.... 

Cara Pemasangan :

• Login ke blog sobat...


• Klik "More Options" selector box kemudian klik "Template" setelah itu pilih "Edit HTML".


• Cari kode ]]></b:skin> kemudian letakan kode berikut ini tepat setelah kode ]]></b:skin>.
  
  
  

  .post img{-webkit-transition: all .4s ease-out;-moz-transition: all .4s ease-out;-o-transition: all .4s ease-out;}.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;} <style type="text/css"> .post img{-webkit-transition: all .4s ease-out;-moz-transition: all .4s ease-out;-o-transition: all .4s ease-out;}.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;} </style>
  
  
  Keterangan :
  
  • //not available...


• Klik "Save" dan lihat hasilnya...

Oke sobat monozcore jangan lupa kritik dan sarannya yaa biar postingan berikutnya semakin unik dan menarik.. Buat yang masih bingung dengan pemasangan widget ini.. monggo ditanyakan lewat kotak komentar, email, facebook ataupun twitter monozcore... happy blogging...

.: Semoga Bermanfaat :.