Membuat image berputar saat disorot mouse
Membuat image berputar saat disorot mouse-Adapun langkah-langkahnya sebagai berikut ini:
1. Seperti biasa sobat harus login dulu di akun blog sobat
2. Pilih rancangan / desain dan klik edit HTML dan lanjutkan
3. Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan
4. Sobat cari kode </head>
5. Setelah ketemu sobat copy paste code di bawah ini tepat di atas kode </head>
1. Seperti biasa sobat harus login dulu di akun blog sobat
2. Pilih rancangan / desain dan klik edit HTML dan lanjutkan
3. Centang "Expand Template Widget" untuk menghindari apabila terjadi kesalahan
4. Sobat cari kode </head>
5. Setelah ketemu sobat copy paste code di bawah ini tepat di atas kode </head>
<style>#freeilmu 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;}
#freeilmu img:hover{ -o-transform: scale(1.5) rotate(360deg); -moz-transform: scale(1.5) rotate(360deg); -webkit-transform: scale(1.5) rotate(360deg);}</style>
#freeilmu 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. dan sobat klik save / simpan template.
Langkah selanjutnya untuk penempatan gambar dalam postingan.
1. Sobat harus menambahkan kode <div id="freeilmu"> sebelum URL gambar dan jangan lupa di tutup dengan kode </div> contoh seperti di bawah ini:
Langkah selanjutnya untuk penempatan gambar dalam postingan.
1. Sobat harus menambahkan kode <div id="freeilmu"> sebelum URL gambar dan jangan lupa di tutup dengan kode </div> contoh seperti di bawah ini:
<div id="freeilmu">
<a href="http://siregarshare.blogspot.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkD4KAAZGw-hC1A4yeKCHDRD0OKlCx9Qw4fAA26mxrk_CWG0mmnUL-wcHZwUI-jEanFp9mdzFZzYnVC4-rTGublERDaIDDSU44mMt-fzt_wL_7QFlpnBQZQ240hNcPRpjQA-Efba7iCYRI/s200/naruto+dont+copy.png" /></a></div>
<a href="http://siregarshare.blogspot.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkD4KAAZGw-hC1A4yeKCHDRD0OKlCx9Qw4fAA26mxrk_CWG0mmnUL-wcHZwUI-jEanFp9mdzFZzYnVC4-rTGublERDaIDDSU44mMt-fzt_wL_7QFlpnBQZQ240hNcPRpjQA-Efba7iCYRI/s200/naruto+dont+copy.png" /></a></div>
Keterangan :
- Kode berwarna merah adalah kode pembuka dan penutup
- 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 dan lihat hasilnya.
Sekian dan semoga bermanfaat!
0 Response to "Membuat image berputar saat disorot mouse"
Posting Komentar