January 18, 2011

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_

18 komentar:

sibutiz said...

wach,makasih ya ka..
ijin save....

Agung X-Zeg Indraguna said...

@sibutiz : silahkan . . .

Kang Epot - Ketipu Penari telanjang said...

bagus sob sharing lagi postingan yang berguna.... :)

genial said...

wahhh bisa jadi keliatan mantapnya tuu kang.. kena mouse over :)

Agung X-Zeg Indraguna said...

@Kang Epot - Ketipu Penari telanjang : ia kang, kebeneran tau ea di posting aja..

@genial : hehe.. lumayan lah sob !!

Anonymous said...

mantaaabbb

Lulus Sutopo said...

Terimakasih Share tutorialnya
Sangat bermanfaat dan teruskan tuk buat tutornya
Sukses selalu mas Agung

Agung X-Zeg Indraguna said...

@Lulus Sutopo : Terima kasih kembali atas kunjungannya.. hanya sekedar berbagi apa yang gw tau !!

vegefruit said...

nice info buddy !!

wali-walet said...

makasih atas infonya,mudah-2 gue bisa mencoba dan membuatnya by http://waletambalat.blogspot.com

♥effa♥ said...

Thanks for sharing :)

Ary_Putra said...

Bagus ini gan... ini yg ku cari setelah muter2 blog. Thanks infonya sob.

Zulfikar's Blog said...

maksih ya
nice blog gan

Begiloguide said...

mantab ,, visit back doonk .. hhe

URL
http://adf.ly/1siZq

Bahlul Putra said...

Kunjungan malam sobb..
Di tumggi Kunjungan balik nya..

iputu dirga said...

nice info gan, mmpir blik y....

Ridlo TaufiQ said...

Thanks Gan, Saya ijin Gunakan Tips Ini, Salam Kenal

aziz rahman said...

mantap.. visit back ya http://tersenyumuntuku.blogspot.com/

Post a Comment