Warung Bebas

Selasa, 20 Maret 2012

Cara Membuat Animasi Berjalan Di Bagian Bawah Blog

 Cara Membuat Animasi Berjalan Di Bagian Bawah Blog - Hai sobat, Selamat berkunjung kembali ke blog KUCOPAS ini. Kali ini saya akan share artikel tips dan trik tutorial blog tentang Cara Membuat Animasi Berjalan Di Blog atau Cara Membuat Animasi Berjalan Di Bagian Bawah Blog.

 Pada posting sebelumnya saya sudah share artikel tentang Cara Buat Foto dan Gambar Bergerak di Blog atau Cara Membuat Gallery Foto Gambar Image Bergerak Atau Berjalan Di Blog, Silahkan sobat klik DISINI jika ingin melihat cara membuatnya.

 Kita kembali lagi pada pokok bahasan, Pernahkah sobat pada suatu saat mengunjungi blog milik orang lain dan sobat melihat ke bawah ada sebuah animasi atau gambar yang bergerak ke kiri lalu ke kanan ataupun sebailknya?

 Dari pada sobat hanya heran dan bingung ataupun penasaran, Sekarang sobat bisa melihat langsung contohnya yang berada di bawah blog DEMO KUCOPAS atau klik DISINI.

 Jika sobat tertarik dan ingin membuat dan memasangnya pada blog sobat, Saya punya tips dan triknya untuk membuat animasi berjalan seperti itu. Cara membuat dan memasangnya di blog sangatlah mudah, Karena sobat hanya memasang kode pada widget blog dan tidak perlu susah-susah edit HTML dalam template blog sobat. Dan tentunya hal itu sangatlah rumit di lakukan oleh para blogger pemula atau newbie seperti saya ini.

Cara Membuat Animasi Berjalan Di Bagian Bawah Blog

 Silahkan sobat ikuti langkah-langkahnya untuk membuat Foto dan Gambar Bergerak di Blog atau Cara Membuat Animasi Berjalan Di Bagian Bawah Blog adalah sebagai berikut ini:

1. Silahkan sobat >> "Masuk atau Login" ke blogger.com menggunakan akun sobat.

2. Pada Dashboard tampilan blogger baru, Pilih Menu >> Tata Letak >> Tambah Gadget >> HTML/Javascript. Jangan di beri judul.

3. Kemudian silahkan sobat masukkan Kode Script di bawah ini ke dalam kotak Konten HTML/Javascript. Pilih salah satu kode saja yang sobat sukai.


1. Animasi Zombie Berjalan Loncat-Loncat


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i1093.photobucket.com/albums/i440/putraeka1/th_avatar2088630_11.gif?t=1295005006" style="cursor: pointer;" /></a></marquee></div>

2. Animasi Alien Berjalan


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i1217.photobucket.com/albums/dd384/TauFixers/MyIcon.png?t=1303003796" style="cursor: pointer;" /></a></marquee></div>

3. Animasi Naruto Berjalan Berubah-ubah

<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/NarutoShippuudden.gif" style="cursor: pointer;" /></a></marquee></div>

4. Animasi Kiba Akamaru Naik Hewan Berlari

<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/KibaAkamaru.gif" style="cursor: pointer;" /></a></marquee></div>

5. Animasi Sasuke Berlari

<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://th217.photobucket.com/albums/cc54/ivandra79/Naruto/th_SASUKE_GIF.gif" style="cursor: pointer;" /></a></marquee></div>

6. Animasi Deidara Naik Burung

<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Akatsuki%20gif/DeidaraBird.gif" style="cursor: pointer;" /></a></marquee></div>

7. Animasi Neji Strikes Mainkan Jurus


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/NejiStrikes.gif" style="cursor: pointer;" /></a></marquee></div>

8. Animasi Leecombo Beraksi


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="2">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/Leecombo.gif" style="cursor: pointer;" /></a></marquee></div>

9. Animasi Jurus Andalan


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="7">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://pic60.picturetrail.com/VOL1698/12134860/21582353/355343243.jpg" style="cursor: pointer;" /></a></marquee></div>

10. Animasi Kakashi


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee direction="right" behavior="left" scrollamount="2">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/Kakashi.gif" style="cursor: pointer;" /></a></marquee></div>

11. Animasi Jiraiya Summoned Naik kodok Menyembur Api


<div id="DADrun" style="bottom: 0px; left: 0px; position: fixed; right: 0px;"><marquee behavior="left" scrollamount="2">
<a href="http://kuc0pas.blogspot.com/2012/03/cara-buat-animasi-berjalan-di-blog-cara.html" target="_blank"><img border="0" src="http://i446.photobucket.com/albums/qq182/kisot06/Naruto1%20gif/JiraiyaSummoned.gif" style="cursor: pointer;" /></a></marquee></div>


KETERANGAN:
  • Silahkan sobat pilih salah satu Kode saja di atas.
  • Kode berwarna BIRU adalah Kode Alamat URL Image atau gambarBisa sobat ganti dengan Alamat URL Image atau gambar milik sobat sendiri.
  • Kode warna PINK (direction="right") adalah Kode Marquee berjalan dari kiri ke kanan. Silahkan di hapus, Jika sobat ingin merubah arah dari kanan ke kiri.
  • Kode warna MERAH (scrollamount="7") adalah Kode Marquee Kecepatan Berjalan atau melintas. Silahkan sobat atur nilainya sesuai dengan keinginan sobat.

 Semua kode diatas sudah pernah saya uji dalam blog demo kucopas, Jadi semua trik diatas dapat di pastikan berhasil 100%. Jika sobat masih mengalami kesulitan dalam pemasangan kode, Silahkan bertanya pada form komentar yang tersedia. Bila ada waktu, Sebisa mungkin saya akan membantu memecahkan permasalahan sobat dalam memasang kode animasi berjalan pada blog.

 Namun jika sobat sudah berhasil membuat dan memasang animasi berjalan di blog sobat, Itu artinya tips dan trik saya berhasil dengan sempurna. Jangan lupa di like dan juga di follow blog KUCOPAS ini.

 Semoga artikel tips dan trik yang saya share ini, Yaitu tentang Cara Buat Animasi Berjalan di Blog atau Cara Membuat Animasi Berjalan Di Bagian Bawah Blog, Bisa sangat bermanfaat untuk sobat KUCOPAS semua.

Selamat Berkarya


0 komentar em “Cara Membuat Animasi Berjalan Di Bagian Bawah Blog”

Posting Komentar

 

M-Kolom Tutorial | All Tutorial Copyright © 2012 Fast Loading -- Powered by Blogger