Membuat Link Tulisan Bergerak Saat Disentuh Mouse

Bookmark and Share

Kadang kita sendiripun merasa bosan melihat link yang hanya diam ditempat saja apalagi untuk para blogger yang variatif...tentu hal ini sangat menarik. Kali ini akan saya jelaskan bagaimana membuat link bergerak jika disentuh mouse. Jika anda ingin membuatnya di blog anda simak ulasannya berikut ini.


Caranya :
login ke Blogger anda
Klik rancangan / tata letak
Klik edit html
Cari kode </head>
Setelah ketemu kode tersebut, copy kode dibawah ini setelah kode diatas :

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('a.nudge').hover(function() { //mouse in
$(this).animate({ paddingLeft: '20px' },400);
}, function() { //mouse out
$(this).animate({ paddingLeft: 0 }, 400);
});
});
</script>



Jika link yang anda gunakan berbentuk teks maka gunakan kode seperti ini :


<a href="URLANDA" class="nudge">LINKTEKSANDA</a>


Jika anda menggunakan link berbentuk gambar maka gunakan kode seperti ini :
<a href="URLANDA" class="nudge"><img src="URLGAMBARANDA" ></a>

Ganti teks yang saya beri warna merah dengan URL anda, biru untuk link yang anda inginkan, coklat untuk url tempat dimana anda menyimpan gambar.

Semoga bermanfaat dan selamat mencoba

{ 0 komentar... Views All / Send Comment! }

Posting Komentar