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 demo effect 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() {
$('#Label1 li').hover(function() { //mouse in
$(this).animate({ marginLeft: '12px' }, 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.
Home »
Tutorial Blog
» Menambahkan Effect JQuery Link Nudging Pada Tabel
Menambahkan Effect JQuery Link Nudging Pada Tabel
Written By Rangga Arief Putra on 13 Jun 2011 | 2:11:00 PM
Related Articles
If you enjoyed this article just click here, or subscribe to receive more great content just like it.
0 comments:
Posting Komentar