Loading...

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:
Oke sekarang langsung saja ke cara membuat efek gambar berputar sekaligus dengan efek zoom berikut ini adalah tutorialnya:
gambar berputar
Gambar berputer / ilustrasi
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. 

/fa-thumbs-up/ RELATED$hide=home

Name

Android,5,Blogging,108,CorelDRAW,14,Desain Grafis,24,Facebook,22,Foto Sampul,34,Gambar,54,Info,18,Internet,31,Kata Mutiara,26,Kesehatan,31,Komputer,25,Microsoft Word,12,Office,12,PhotoScape,10,Resep,6,SEO,10,Sosial media,21,Tutorial,36,Wallpaper,20,
ltr
item
Bangiz: Cara Membuat Gambar Berputar di HTML
Cara Membuat Gambar Berputar di HTML
Membuat efek berputar pada gambar blog, Efek putar dan zoom pada blogger blogspot, Membuat gambar berputar dan membesar di html, membuat efek keren pada gambar ketika tersentuh mouse...
https://1.bp.blogspot.com/-pIl6vBFmKdo/Uu9pxJKZlSI/AAAAAAAAJ4Y/XuV8VaF4iDs/s1600/drifting.jpg
https://1.bp.blogspot.com/-pIl6vBFmKdo/Uu9pxJKZlSI/AAAAAAAAJ4Y/XuV8VaF4iDs/s72-c/drifting.jpg
Bangiz
https://bangiz.blogspot.com/2014/02/Gambar-berputar.html
https://bangiz.blogspot.com/
https://bangiz.blogspot.com/
https://bangiz.blogspot.com/2014/02/Gambar-berputar.html
true
5131493432912556385
UTF-8
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS CONTENT IS PREMIUM Please share to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy