Cara Membuat Gambar Berputar di HTML

Halo sahabat Blogger semuanya, untuk kali ini Bangiz mau berbagi tentang salah satu cara yang bisa Anda gunakan untuk mempercantik tampilan blog yang Anda miliki. Sesuai dengan judul di atas yaitu membuat gambar berputar di HTML. Maksudnya yaitu dengan menambahkan kode CSS pada kode HTML blog yang mana tanpa menggunakan jquery. Adapun efeknya adalah berputar sekaligus gambar akan membesar. Sebelum lanjut mungkin Anda juga perlu membaca tentang:

• Membuat Floating DropDown Menu Untuk Blogger 
• Membuat Link Terbuka di Tab Baru 

Oke sekarang langsung saja ke cara membuat efek gambar berputar sekaligus dengan efek zoom berikut ini adalah tutorialnya:

1. Masuk Dasbor Blogger 

2. Pilih Template > Edit HTML

3. Cari kode ]]></b:skin> (Gunakan Ctrl+F untuk memudahkan)

4. Copy-Paste kode berikut di atas / sebelum kode ]]></b:skin>

.post img{-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s 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}}

5. Simpan template kemudian lihat hasilnya

Itulah tutorial tentang membuat gambar dengan efek berputar pada blog, silahkan berikan komentar anda apabila ada yang kurang dimengerti dan jangan lupa ikuti Bangiz melalui sosial media untuk mendapatkan update terbaru.