Cara Memasang Animasi Bergerak Yang Lucu dan Keren Untuk Blog -
Ternyata banyak sekali blogger – blogger yang sangat menyukai animasi bergerak pada blognya. Bisa terlihat ketika saya berkunjung ke beberapa blog teman. Dari animasi
yang simple dengan ukuran mini sampai yang ribet dengan ukuran jumbo
banyak terpasang di blog mereka. Ya itu juga karena selera masing2 orang
berbeda. Memang animasi pada blog sangat membantu blog agar terlihat
menarik. Jadi blog akan terlihat hidup dan tidak membosankan. Sebelumnya
saya pernah juga memposting tentang animasi bergerak, tapi saya rasa pada postingan sebelumnya pilihan animasi terlalu sedikit. Sehingga saya memposting kembali mengenai animasi bergerak
lagi, namun dengan pilihan yang beragam dan banyak tipe agar bagi anda
yang ingin memasang animasi jadi lebih banyak referensi dan pilihan.
Berikut daftar dan cara memasangnya
Cara Memasang Widget Animasi Bergerak Di Blog
- Login ke dasbor blog anda
- Pilih rancangan
- Pilih Tambah Gadget
- Pilih Html/Java Script
- Lalu copy kode Html animasi yang anda ingin pasang di blog. Kodenya ada di bawah, anda bisa memilih sesuai keinginan anda.
- Pastekan kode tadi di Html/java script tadi.
- Simpan, dan selesai
Daftar Kode Html Animasi Bergerak
1.Spongebob
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
2.Naruto
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
3.Gaara
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
4.Labu
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
5.Tengkorak
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
6.Ekspresi Muka
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
7. Animasi
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.blogspot.com/" target="_blank"><img
border="0" src="http://i.mnpls.com/715/71510.gif" title="My widget"
alt="animasi bergerak gif"
/></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
8. Main Taplak
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
9. Pasangan
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
10.Zoombie
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
11.Pigglet
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
12.MiniMouse
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
13. Hallo
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
14.Hai Friend
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
15.Star
<div
style="position: fixed; bottom: 0px; left:
10px;width:130px;height:160px;"><a
href="http://permathic.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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">My
Widget</a></center></small></div>
16.Gajah Loncat
<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget-Animasi</a></center></small></div>
17.Booring
<div style="position: fixed; bottom: 0px; left: 20px;width:80px;height:120px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img
src="http://content.sweetim.com/sim/cpie/emoticons/0002016B.gif"
border="0" /></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget-Animasi</a></center></small></div>
18.Bayi ketawa
<div style="position: fixed; bottom: 0px; right: 20px;width:82px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img
src="http://content.sweetim.com/sim/cpie/emoticons/0002031F.gif"
border="0" /></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget-Animasi</a></center></small></div>
19. Dance
<div style="position: fixed; bottom: 0px; left: 20px;width:82px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img
src="http://content.sweetim.com/sim/cpie/emoticons/0002013F.gif"
border="0" /></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget-Animasi</a></center></small></div>
20.Main Bola
<div style="position: fixed; bottom: 0px; right: 30px;width:160px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img
src="http://content.sweetim.com/sim/cpie/emoticons/0002032D.gif"
border="0" /></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget-Animasi-Blog</a></center></small></div>
21.Bayi Tertawa
<div style="position: fixed; bottom: 0px; left: 20px;width:120px;height:100px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img border="0"
src="http://content.sweetim.com/sim/cpie/emoticons/0002031E.gif"
title="Click to get more."
/></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget-Animasi</a></center></small></div>
22.Panda Biru
<div style="position: fixed; bottom: 0px; left: 20px;width:100px;height:100px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Free-Widget-Animasi</a></center></small></div>
23. Panah
<div style="position: fixed; bottom: 0px; left: 10px;width:210px;height:120px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
23. Bunga
<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
24. Anjing Laut
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
25. Lumba-lumba
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img border="0"
src="http://content.sweetim.com/sim/cpie/emoticons/000203BA.gif"
title="Click to get more."
/></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
26. Kucing Tidur
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:140px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img border="0"
src="http://content.sweetim.com/sim/cpie/emoticons/000203C0.gif"
title="Click to get more."
/></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
27. Kelinci
<div style="position: fixed; bottom: 0px; left: 10px;width:125px;height:160px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img border="0"
src="http://content.sweetim.com/sim/cpie/emoticons/000203A0.gif"
title="Click to get more."
/></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
28. Dragon
<div style="position: fixed; bottom: 0px; left: 10px;width:150px;height:130px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank"><img border="0"
src="http://content.sweetim.com/sim/cpie/emoticons/00020478.gif"
title="Click to get more."
/></a><small><center><a
href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
29. Ikan
<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:130px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
30. Pinguin
<div style="position: fixed; bottom: 0px; left: 10px;width:110px;height:130px;"><a href="http://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
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://permathic.blogspot.com/2012/05/kumpulan-animasi-bergerak-yang-lucu-dan.html"
target="_blank">Widget
Animasi</a></center></small></div>
Catatan !!
ada bisa mengatur dimana anda ingin meletakan animasi tersebuat sesuai
keinginan. Caranya dengan mengedit tulisan bottom (bawah), top (atas),
left ( kiri), right (kanan),
Contoh
: jika anda ingin memasang di pojok kanan atas, berarti anda harus
mengubahnya menjadi top dan right. Mudah bukan ? selamat mencoba..
 |
| Mouse Pelangi |
<style type="text/css">body,
a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-1/cur18.ani),
url(http://cur.cursors-4u.net/cursors/cur-1/cur18.png), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Wavy Tail"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Wavy Tail"
style="position:absolute; top: 0px; right: 0px;" /></a>
 |
| Cartoon |
<style type="text/css">body,
a:hover {cursor:
url(http://cur.cursors-4u.net/games/gam-15/gam1440.ani),
url(http://cur.cursors-4u.net/games/gam-15/gam1440.gif), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Toad Jumping Up and Down"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Toad Jumping
Up and Down" style="position:absolute; top: 0px; right: 0px;"
/></a>
 |
| Fire Guitar |
<style type="text/css">body,
a:hover {cursor:
url(http://cur.cursors-4u.net/games/gam-15/gam1440.ani),
url(http://cur.cursors-4u.net/games/gam-15/gam1440.gif), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Toad Jumping Up and Down"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Toad Jumping
Up and Down" style="position:absolute; top: 0px; right: 0px;"
/></a>
 |
| Love |
<style type="text/css">body,
a:hover {cursor:
url(http://cur.cursors-4u.net/holidays/hol-6/hol512.ani),
url(http://cur.cursors-4u.net/holidays/hol-6/hol512.png), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Valentine's Day Pumping Heart"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Valentine's
Day Pumping Heart" style="position:absolute; top: 0px; right: 0px;"
/></a>
 |
| Peace |
<style type="text/css">body,
a:hover {cursor:
url(http://cur.cursors-4u.net/symbols/sym-8/sym714.ani),
url(http://cur.cursors-4u.net/symbols/sym-8/sym714.gif), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Different Types Of Peace Symbol"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Different
Types Of Peace Symbol" style="position:absolute; top: 0px; right: 0px;"
/></a>
 |
| Icon Moon |
<style
type="text/css">body, a:hover {cursor:
url(http://cur.cursors-4u.net/cursors/cur-10/cur945.ani),
url(http://cur.cursors-4u.net/cursors/cur-10/cur945.png), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Batman Begins - Diagonal Resize 2"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Batman Begins
- Diagonal Resize 2" style="position:absolute; top: 0px; right: 0px;"
/></a>
 |
| samurai x |
<style
type="text/css">body, a:hover {cursor:
url(http://cur.cursors-4u.net/special/spe-1/cloud_strife.ani),
url(http://cur.cursors-4u.net/special/spe-1/cloud_strife.png), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Final Fantasy 7 Cloud Strife"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Final Fantasy
7 Cloud Strife" style="position:absolute; top: 0px; right: 0px;"
/></a>
 |
| monkey |
<style
type="text/css">body, a:hover {cursor:
url(http://cur.cursors-4u.net/nature/nat-2/nat192.ani),
url(http://cur.cursors-4u.net/nature/nat-2/nat192.png), progress
!important;}</style><a
href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html"
target="_blank" title="Cute Rocking Baby Monkey"><img
src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Cute Rocking
Baby Monkey" style="position:absolute; top: 0px; right: 0px;"
/></a>
