Membuat Effect JQuery Link Nudging di Blog

Membuat Effect JQuery Link Nudging di Blog

Kali ini kembali saya akan memberikan penjelasan kepada temen-temen dalam memodifikasi tampilan link di blog. kali ini saya akan menjelaskan cara menambahkan efek jQuery nudging link. JQuery link nudging sebagai 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.

Jika temen-temen tertarik, langsung saja saya akan berikan penjelasannya :

Login ke blogger dengan akun anda

Kemudian pada dasbor  klik Rancangan >> Edit HTML
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 : Jika anda sudah memasukkan script JQuery diatas, langkah ketiga bisa anda abaikan
Setelah itu 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 -->  

Terakhir Save Template anda, dan lihat hasilnya
, jika ada pertanyaan teman-teman bisa isi kotak komentar di bawah. Selamat mencoba dan semoga bermanfaat