r
Apa kabar sahabat, Saya akan membahas tentang cara membuat Efek Gambar Berputar dan Membesar Di Blog... ini cocok untuk template animasi dan kita langsung saja ke TKP.
Jika anda ingin membuat Efek Gambar Berputar dan Membesar Di Blog.
Langsung saja berikut langkah-langkah memasang Efek Gambar Berputar dan Membesar Di Blog.
6. Jika sudah jangan lupa simpan template anda.
Langkah selanjutnya untuk penenpatan gambar dalam postingan.
Sobat harus menambahkan kode <div id="denzuaz"> sebelum url gambar dan jangan lupa di tutup dengan kode </div> contoh seperti di bawah ini:
<div id="denzuaz">
<a href="http://ariefbudiyantoo.blogspot.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYRWnYRM1BQwfDdrjf9Bc7y4C1EjOCLHEe_aCh2Gath3OTISIGgLknz-AAj9Lrs2RBgikq6xOiyMFTO2qrBtajNXOaykV4BExwziJGO-DfZoRGhLJQC9QUpLLx8Pl1dV0ui4yjcrQH3q3b/s200/naruto+dont+copy.png" /></a></div>
keterangan:
kode berwarna merah adalah kode pembuka dan penutup
kode berwarna hijau silakan sobat ganti dengan URL blog Sobat dan URL gambar yang ingin Sobat pasang di dalam postingan.
Setelah semuanya selesai klik publikasikan.
Selamat Bereksperimen!
Jika anda ingin membuat Efek Gambar Berputar dan Membesar Di Blog.
Langsung saja berikut langkah-langkah memasang Efek Gambar Berputar dan Membesar Di Blog.
- Pertama-tama Log In terlebih dahulu ke account Blogger Anda.
- Jika sudah login, di bagian dashbord blog pilih Template untuk mengakses halaman edit HTML.
- Jika sudah jangan lupa back-up template blog sebelum melakukan edit HTML untuk menghindari kesalahan saat mengedit html.
- Jika sudah cari kode </head> (Gunakan tombol CTRL + F dan F3 untuk mempermudah pencarian kode)
- Jika sudah ketemu, Copy kode dibawah dan letakan tepat diatas kode </head>
<style>#denzuaz 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;}
#denzuaz img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}</style>
#denzuaz img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}</style>
6. Jika sudah jangan lupa simpan template anda.
Langkah selanjutnya untuk penenpatan gambar dalam postingan.
Sobat harus menambahkan kode <div id="denzuaz"> sebelum url gambar dan jangan lupa di tutup dengan kode </div> contoh seperti di bawah ini:
<div id="denzuaz">
<a href="http://ariefbudiyantoo.blogspot.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYRWnYRM1BQwfDdrjf9Bc7y4C1EjOCLHEe_aCh2Gath3OTISIGgLknz-AAj9Lrs2RBgikq6xOiyMFTO2qrBtajNXOaykV4BExwziJGO-DfZoRGhLJQC9QUpLLx8Pl1dV0ui4yjcrQH3q3b/s200/naruto+dont+copy.png" /></a></div>
keterangan:
kode berwarna merah adalah kode pembuka dan penutup
kode berwarna hijau silakan sobat ganti dengan URL blog Sobat dan URL gambar yang ingin Sobat pasang di dalam postingan.
Setelah semuanya selesai klik publikasikan.
Selamat Bereksperimen!
Read more: http://ariefbudiyantoo.blogspot.com/2013/02/cara-membuat-efek-gambar-berputar-dan.html#ixzz2SDKLSCEv
0 komentar:
Posting Komentar