Pages

Selasa, 22 Maret 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.



Sebagai contohnya anda bisa lihat di bawah ini coba mous anda arahkan ke teks ini.....!!!!!



Contoh 01



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









Terima Kasih
Created By Syarief Hidayat



------------------------------------------------------------------------------------------

Tidak ada komentar:

Posting Komentar

 

Sample text

Sample Text

Sample Text