Membuat Berbagai Animasi Bergerak Di Blog

Salam damai bagi kita semua. Kali ini sesuai judulnya, saya berbagi tutorial untuk sobat monfoort blog. Yaitu cara membuat berbagai animasi bergerak. Post ini saya buat dengan menggabung sekitar 10 post dari 4 blog. Saya rangkum sehingga lebih mudah di mengerti. Soalnya sumbernya menggunakan bahasa inggris. Langsung  saja kita mulai tutorialnya.

• Buka Akun Blogger sobat
• Buka Layout/Tata Letak
• Add gadget
• HTML / JavaScript
• Isi dengan animasi yang anda inginkan, tinggal di pilih

1. Animasi Naruto VS Sasuke

<div style="position: fixed; bottom: 0px; left: 20px;width:110px;height:80px;"> <a href="http://www.blogzeng.com/2013/02/membuat-widget-naruto-vs-sasuke.html"target="_blank" rel="dofollow"><img src="http://i1210.photobucket.com/albums/cc417/kusanagiblog/NarutoVSSasuke.gif"alt="gambar"title="Widget Naruto VS Sasuke"/></a></div>

2. Animasi Spideman

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"> <a href="http://www.blogzeng.com/" target="_blank"><img border="0" src="http://s.myniceprofile.com/myspacepic/3/th/312.gif" title="My widget" alt="animasi bergerak gif" /></a><small><center> <a href="http://www.blogzeng.com/2013/02/membuat-widget-animasi-spiderman.html" target="_blank" title="Cara Memasang Widget Animasi Spiderman">My Widget</a></center> </small></div>

3. 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>

4. Naruto Ekor 1

<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>

5. Gara

<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>

6. 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>

7. Sharingan

<div style="position: fixed; bottom: 0px; left: 10px;width:130px;height:160px;"> <a href="http://softwaremaniapc.blogspot.com/2013/03/cara-membuat-gambar-animasi-bergerak-di.html" 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://softwaremaniapc.blogspot.com/" target="_blank">Tutorial Blog</a></center> </small></div>

8. Semua Karakter Naruto

<div style="position: fixed; bottom: 80px; left: 10px;width:130px;height:160px;"> <a href="http://softwaremaniapc.blogspot.com/2013/03/cara-membuat-gambar-animasi-bergerak-di.html" 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://softwaremaniapc.blogspot.com/" target="_blank">Tutorial Blog</a></center> </small></div>

9. Zombie

<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>

10. Doraemon

<div style="position: fixed; bottom: 80px; left: 10px;width:130px;height:160px;"> <a href="http://softwaremaniapc.blogspot.com/2013/03/cara-membuat-gambar-animasi-bergerak-di.html" 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://softwaremaniapc.blogspot.com/" target="_blank">Tutorial Blog</a></center> </small></div>

11. Helikopter

<div style="position: fixed; bottom: 80px; left: 10px;width:110px;height:130px;"> <a href="http://softwaremaniapc.blogspot.com/2013/03/cara-membuat-gambar-animasi-bergerak-di.html" target="_blank"><img border="0" src="http://content.sweetim.com/sim/cpie/emoticons/00020389.gif" title="Selamat Datang" /></a><small><center> <a href="http://softwaremaniapc.blogspot.com/" target="_blank">Tutorial Blog</a></center> </small></div>

12. Tobi

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:150px;"> <a href="http://zhadewo.blogspot.com/" target="_blank"><img src="http://pic60.picturetrail.com/VOL1698/12134860/21581772/355351427.jpg" alt="gambar" title="Zhadewo Blog'z" height="150" width="300" /></a></div>

13. Sasori

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:150px;"> <a href="http://zhadewo.blogspot.com/" target="_blank"><img src="http://pic60.picturetrail.com/VOL1698/12134860/21582353/355343144.jpg" alt="gambar" title="Zhadewo Blog'z" height="150" width="300" /></a></div>

14. Luffy

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:150px;"> <a href="http://zhadewo.blogspot.com/" target="_blank"><img src="http://onepieceindo.files.wordpress.com/2009/10/luffyattack.gif" alt="gambar" title="Zhadewo Blog'z" height="150" width="300" /></a></div>

15. Indonesia

<div style="position: fixed; bottom: 0px; left: 10px;width:100px;height:150px;"> <a href="http://zhadewo.blogspot.com/" target="_blank"><img src="http://kkcdn-static.kaskus.co.id/images/2012/07/17/2212892_20120717113942.gif" alt="gambar" title="Zhadewo Blog'z" height="150" width="300" /></a></div>

Semoga sobat monfoort bisa mengerti dengan apa yang saya jelaskan
Kalau kurang, saya minta maaf