Membuat Tampilan Link Bergerak Saat di Lewati Kursor

Sobat pasti Anda pernah melihat di blog seseorang diman apabila link tersebut tersentuh kursor maka link tersebut akan bergerak..

Nah, untuk membuat tampilan link bergerak saat di lewati kursor seperti itu, kali ini, kita akan membahas cara membuatnya.

  • Pertama login ke Blogspot anda.
  • Klik menu Rancangan.
  • Kemudian klik Edit HTML.
  • Jagan lupa untuk Centang Expand Template Widget.
  • Silahkan cari kode ini </head>.
  • Setelah ketemu, silahkan copy kode berikut dan letakkan diatas kode </head> di atas.
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/><script type='text/javascript'>
$(document).ready(function() {
$(&#39;a&#39;).hover(function() { //mouse in
$(this).animate({ marginLeft: &#39;12px&#39; }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});</script>
  • Setelah itu silahkan klik SIMPAN TEMPLATE.
  Sekarang silahkan buka blog Anda dan coba arahkan kursor Anda di salah satu link yang ada di blog Anda dan lihat perubahannya. Sekian cara  membuat tampilan link bergerak saat di lewati kursor dan ini hanya berlaku di blogspot atau blogger.

0 komentar :