menambahkan effect jquery link nudging pada tabel

JQuery link nudging adalah effect animasi pada link hasil dari penambahan padding kiri, effect ini akan nampak saat kita menyentuhkan pointer/mouse  pada link, link akan bergerak kekanan atau bergoyang. Seru juga jadinya, tertarik ingin menerapkan JQuery Link Nudging pada blog sobat? Silahkan ikuti tutorial berikut atau terlebih dahulu silahkan lihat demoeffect JQuery link nudging pada tabel di blog ini

1. Setelah sig in pada account blogger sobat>>> pada dasbor>>> Klik Rancangan>>> Edit HTML
2. Tambahkan Script JQuery berikut diatas kode </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>

Catatan: abaikan langkah kedua bagi sobat yang sudah menginstal script JQuery diatas pada template blogger sobat.
3. Tambahkan lagi script berikut dibawah script JQuery tadi:

<script type='text/javascript'>
$(document).ready(function() {
$(&#39;#Label1 li&#39;).hover(function() { //mouse in
$(this).animate({ marginLeft: &#39;12px&#39; }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});
</script><!-- end LinkNudging -->

4. Simpan, dan lihat hasilnya pada blog sobat.
Mudah bukan? Selamat mencoba, semoga berhasil dan bermanfaat.
Resource David Wals
Demo 

Artikel Terkait:

Tutorial Blog

• Cara Membuat Link Bergeser
• Cara Membuat Menu Warna Warni
• Cara Memuat Spoiler Untuk Blog
• Headline News KATA SENDIRI
• Cara Memasang Widget Page Rank dengan mudah dan cepat
• Cara Pasang Related Post With thumbnails
• Pasang Navigasi Breadcrumb di Blogger Diatas Posting
• Efek For Blog
• Cara Membuat Backround Pada Judul Postingan
• Cara Membuat Link Beraneka Rgam
• Cara Membuat Kode warna Versi 2
• Cara Pasang Sexy Social Boommark
• Cara Membuat Menu Tab View
• Cara Pasang Top Komentartor
• Tweety Bird Blogger Template
• Related post atau postingan terkait [With Tuhumbanail]
• Cara Mengganti Foto Profil Blog Dengan Animasi
• Cara Membuat Animasi Berjalan Dibawah tengah blog
• Cara Membuat Tag Cloud
• Cara Membuat Gambar ketika mouse diarahkan
• Isengin Pengunjung Yuk!!!
• Cara Membuat Bukutamu tersembunyi Versi TERBARU
• Cara Menampilkan Judulnya Saja Ketika label di klik
• Cara Pasang Slide Post

Posted in: Tutorial Blog