Membuat Efek Zoom Berputar Pada Gambar di Blog

LIVE DEMO:

Untuk membuatnya berikut ini adalah Cara Membuat Efek Zoom Berputar Pada Gambar di Blog:

1) Masuk ke dashboard blogger lalu klik Template
2) Cari tag penutup ]]></b:skin> atau </style> ( kalau kode </style> ada lebih dari 1 silahkan coba dimana yang cocok). saran saya diatas kode ]]></b:skin>.
3) Pastekan CSS di bawah ini tepat di atas tag penutup ]]></b:skin> atau </style>

#seocips img{-moz-transition:all .8s ease-in-out;-ms-transition:all .8s ease-in-out;-o-transition:all .8s ease-in-out;-webkit-transition:all .8s ease-in-out;transition:all .8s ease-in-out;}
#seocips img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}

4) Untuk menerapkannya pada postingan blog contohnya adala kode di bawah ini, dalam mode HTML postingan.

<div id="seocips">
<div style="text-align: center;">
<a href="http://www.seocips.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjm3H_EIkA0ecUjxxGpMEs7IKKIsRbCT7tQ4IJVTZE7Ez6p2CA2EdEyZCCdGAFUuc0xvu8rR0kJLDOWU2bQGBLz4c5Ks9nvJD5R0uMGDvcl4ws6MUPjV9PP_BbkHZS7apaURIVUUslvxCc/s1600/Seocips-efect-blog.jpg" height="200" width="200" /></a></div>

Untuk kode berwarna merah diatas adalah url gambar, slihakan ganti dengan gambar yang sobat inginkan. sekarang tinggal sobat publikasikan artikel sobat dan lihat hasilnya pada gambar sobat.