Selasa, 19 April 2011

Link Nudging diblogger

Tahapan Penerapan Link Nudging di Blogger Template pada Widget Label


Sebelum melakukan tahapan ini, anda harus memasang Widget Label, dan Tag Posting di blog anda.

1. Masukan script jQuery berikut diatas </head>:

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

:: catatan jika telah memiliki script jQuery di template anda, maka script ini tidak diperlukan lagi.

2. Masukan kode Javascript berikut dibawah script jQuery:

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


:: Catatan:
- Kode '#Label1' diatas adalah perintah untuk memberikan effect pada Label. Kode '#Label1' ini dapat anda rubah atau tambah untuk memberikan effect pada link lainnya.
- Kode 'marginLeft', adalah effect gerak kekiri link tersebut, ini pun dapat anda rubah sesuai selera anda (lihat: Link Hover Animasi dengan jQuery).

3. Save, selesai.

:: Lihat juga: Menu Navigasi Vertikal dengan Efek Jquery

Tidak ada komentar:

Posting Komentar