Memberi Animasi di
Blogspot
Hey blogger-blogger di seluruh dunia! Sebuah blog tanpa gambar animasi akan terlihat tidak hidup. Jadi, saya akan mengulas tentang cara "Memberi Animasi untuk Blogspot".
Caranya....
1. Login ke dasbor blog anda
3. Pilih Tambah Gadget
4. Pilih HTML/JavaScript
5. Copy salah satu kode HTML animasi yang anda inginkan. Saya sudah memberi beberapa contoh untuk anda.
6. Paste kode di Html/Javascript tadi.Simpan
Gampang kan?
Ini beberapa contoh gambar animasi beserta kode HTML
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1028/th/102882.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/692/th/69207.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/539/th/53973.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://sig.graphicsfactory.com/Halloween/a.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1/th/152.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/742/th/74214.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/0/th/72.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/229/th/22949.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/466/th/46602.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/438/th/43833.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/485/th/48554.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/212/th/21215.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/243/th/24365.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/102/th/10221.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203BC.gif" title="Click to get more." /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget-Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 20px;width:80px;height:120px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002016B.gif" border="0" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget-Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; right: 20px;width:82px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002031F.gif" border="0" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget-Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 20px;width:82px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002013F.gif" border="0" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget-Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; right: 30px;width:160px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img src="http://content.sweetim.com/sim/cpie/emoticons/0002032D.gif" border="0" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget-Animasi-Blog</a></center></small></div>
HTML Code:
HTML Code:
<div style="position: fixed; bottom: 0px; left: 20px;width:100px;height:100px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/0002033D.gif" title="Click to get more." /></a>
<small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Free-Widget-Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:210px;height:120px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020236.gif" title="Click to get more." /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020322.gif" title="Click to get more." /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/000203B5.gif" title="Click to get more." /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020479.gif" title="Click to get more." /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020484.gif" title="Click to get more." /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">Widget Animasi</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020389.gif" title="widget animasi lucu bergerak atau gif" alt="animasi bergerak naruto dan onepiece"/></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/110/th/11046.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/197/th/19769.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/1031/th/103123.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/539/th/53966.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/228/th/22801.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/712/th/71266.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/656/th/65649.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank" title="Cara Memasang Widget Animasi">My Widget</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://semangka-piska.blogspot.com/" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrz5e2TKYPg5DI-bDAI8TL2sjbxuvv080WOluxAwyk0fzD5ggYK84PtYHt0LDBQjXopOIe8vsCNO13dV_j3amdGDI-z9E1foEH4y5ORu7yf44_mLTPYcjsJ7QchhZBOZEy5J6XZiuYT1cQ/s1600/animasi-gerak-lucu-649.gif" title="widget animasi lucu bergerak atau gif" alt="animasi bergerak naruto dan onepiece"/></a><small><center><a href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html" target="_blank">animasi bergerak</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left:
10px;width:110px;height:130px;"><a
href="http://semangka-piska.blogspot.com/" target="_blank"><img
border="0"
src="http://adi1cahyonoputra.files.wordpress.com/2010/02/dog.gif"
title="widget animasi lucu bergerak atau gif" alt="animasi bergerak
naruto dan onepiece"/></a><small><center><a
href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html"
target="_blank">animasi bergerak</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left:
10px;width:110px;height:130px;"><a
href="http://semangka-piska.blogspot.com/" target="_blank"><img
border="0"
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivCHVrIi2KYOtoxXSQArP8OKhQqVXdlBaMC7tpGR2HhkCnmAymC1vbeltUMMNW5tXjYJoy_4QjgGyve0xbq93pWDzJv8UuLDOcZm0n-n3Sw1sbq9FbLwquuUtHQ_HFpxt7goaQj4e8Uxg8/s1600/animasi+power+point-37.gif" alt="animasi bergerak
naruto dan onepiece"/></a><small><center><a
href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html"
target="_blank">animasi bergerak</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left:
10px;width:110px;height:130px;"><a
href="http://semangka-piska.blogspot.com/" target="_blank"><img
border="0"
src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfnKSMc_vRZdNNbKIe95bZyiABnhTaufv7thYiGGq_qbpaGwiTLo4X-MRc089kYNIruKnwQVUz2TZDdprFpW6cpfEF8N5f0HuPGNL0PpExdm0gp8gAEJDqI4wofgtUPBMm-36JoggwAOCj/s1600/Star+Dude+Animation2.gif"
alt="animasi bergerak
naruto dan onepiece"/></a><small><center><a
href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html"
target="_blank">animasi
bergerak</a></center></small></div>
HTML Code:
<div style="position: fixed; bottom: 0px; left:
10px;width:110px;height:130px;"><a
href="http://semangka-piska.blogspot.com/" target="_blank"><img
border="0"
src="http://pisbon.files.wordpress.com/2010/12/angel4.gif"
alt="animasi bergerak
naruto dan onepiece"/></a><small><center><a
href="http://semangka-piska.blogspot.com/2012/10/memberi-animasi.html"
target="_blank">animasi
bergerak</a></center></small></div>
Catatan:
Anda bisa mengganti posisi animasi dengan mengganti 'bottom' dengan:
bottom: jika anda menginginkan animasi berada di bawah
top: jika anda ingin animasi berada di atas
Mengganti left dengan:
right: jika anda ingin animasi berada di kanan
left: jika anda ingin animasi berada di kiri
intip blognya mbak arum...#kewreeennn#
BalasHapus^tante iput^