Cara Mudah Membuat Efek Zoom Gambar Berputar

Sang Alang Penikmat Senja 1:43 PM
Membuat Efek Gambar Berputar - Pada postingan kali ini, admin litera akan menyuguhkan efek anamasi untuk mempercantik blog sobat. Efek yang bisa menampilkan efek gambar zoom yang berputar bisa mempercantik tampilan gambar yang Sobat upload kedalam postingan blog. Berikut cara mudahnya:

  • Login ke Blogger
  • Masuk ke Dashboard Blogger yang akan diberi efek ini lalu klik Template
  • Cari tag penutup ]]></b:skin> atau </style> (kalau tidak ada kode </style> lebih dari satu silahkan dicari mana yang sesuai; Biasanya diatas kode ]]></b:skin>).
  • Pastekan CSS kode dibawah tepat diatas 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);}
  • Untuk menerapkannya pada postingan blog, Sobat bisa dengan meletakkan kode dibawah ini kedalam 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/AVvXsEhA9UH2dNnbO8WxzXlQOBxrGIjPBUmtvJhy-ibze-snIWSU0L6cjTm7jFc8C8R0MrAHZOfJtBCF40X5yAIgCB02UPuV-AaS6vH0dxaAcEJxE6k67d9yWqSwIeKnCi04wnhrvyOzSECyaVY/s1600/blablabla.jpg" height="200" width="200" /></a></div>
Kode berwarna pink diatas adalah URL gambar. URL itu bisa diganti dengan gambar yang Sobat inginkan. Semoga bermanfaat...