Link Bergerak Saat Disorot Mouse

Link Bergerak Saat Disorot Mouse – Setelah dulu gw nulis tentang cara membuat efek link warna pelangi, kali ini gw mau coba share satu cara lain yang bisa kita gunain buat modifikasi link. Cara ini lumayan seru lah, sebab link yang kita buat nanti bisa bergerak kalo disorot oleh mouse.

Kita mulai ea !!

Langkah pertama:
1. Login dulu ke blogger.com
2. Pilih menu “Design”
3. Klik “Edit HTML”
4. Cari kode </head>
5. Copy/paste kode dibawah ini tepat setelah kode </head>

<script src='http://agungxzeg.googlecode.com/files/dynamiclink.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('a.nudge').hover(function() { //mouse in
$(this).animate({ paddingLeft: '5px' },400);
}, function() { //mouse out
$(this).animate({ paddingLeft: 0 }, 400);
});
});
</script>

6. Klik “Save Template”

Langkah kedua:
Dalam pembuatan link nanti, tambahkan kode class="nudge"

Contoh link dengan teks:

<a href="url tujuan" class="nudge">teks yang akan dijadikan link</a>

Contoh link dengan gambar:

<a href="url tujuan" class="nudge"><img src="url gambar"></a>

Keterangan:
1. Silahkan ubah contoh link di atas sesuai kebutuhan
2. Teks yang berwarna hijau adalah jarak bergerak link, silahkan di ubah sesuai selera

---

Related Post on Agung X-Zeg Indraguna's World_

Blog World

• Menambahkan Efek OnMouseOver Transparan Pada Gambar
• Cara Pasang Energy Saving Mode dengan Gambar
• Menambahkan Efek OnMouseOver Pada Gambar
• Cara Membuat Teks Warna Pelangi (Rainbow Text)
• Cara Pasang Navigasi Breadcumb di Blogger
• Cara Mengganti dan Menampilkan Favicon Blog di Semua Browser
• Menambahkan Emoticon Pada Shoutmix
• Cara Membuat Komentar Pemilik Blog Berbeda Dengan Pengunjung
• Membuat Spoiler di Blog
• Membuat Gambar Melayang di Blog
• Cara Pasang AddThis Share Button di Blog
• Membuat Text Area di Blog
• Cara Pasang Kode Warna HTML (HTML Color Code) di Blog
• Menambahkan Pesan di Bawah Posting Blog
• Link Otomatis Terbuka Tanpa di Klik
• Menampilakan Avatar Komentator
• Cara Membuat Buku Tamu Tersembunyi
• Daftar Website/Blog di Google, Yahoo dan Search Engine Lainnya
• Cara Membuat Form Untuk Banner Exchange
• Menambahkan Energi Saving Mode di Blog
• Menambahkan Scroll Button di Arsip Blog
• Auto-Hide Navigation Bar
• Membuat Efek Link Warna Pelangi
• Menghilangkan Navigation Bar di Blog