July 17, 2012

Cara Membuat Link Bergoyang dengan J-Query



Add jQuery Link Nudging On Links Hover For Blogger Blogs



Halo gan, Happy blogging dengan imam77 , sehabis menjelajah ke dunia luar , ternyata saya nemuin kayak begini "Cara membuat link bergoyang dengan J-Query"
ya ini adalah sebuah efek link hover , yaitu ketika link didekatkan dengan mouse maka akan berubah bentuk

lihat demonya disini : coba agan arahin mouse ke sisi dari sidebar "Partner Link" maka mereka otomatis akan bergoyang.

Demo



Pertama ke Blogger> Desain Tab Dashboard> Edit HTML


cari </ head>


Tambahkan kode berikut hanya Sebelum </ head>




<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'
type='text/javascript'> </script>  <script
 type='text/javascript'>
  var dur = 400; // Duration Of Animation in Milli Seconds
  $(document).ready(function() {       
$('a.linknudge').hover(function() {        
  $(this).animate({             
 paddingLeft: '25px'        
  }, dur);   
   }, function() {        
  $(this).animate({          
    paddingLeft: 0        
}, dur); }); }); // end of Jquery Script </script>



Setelah itu Simpan Template.



Nah untuk mengaktivasikan linknya .



anda harus membuat link dengan kode sbgai berikut :



<a class='linknudge'
href='http://www.way2blogging.org'>Way2blogging</a>

mungkin anda bisa menaruhnya di elemen halaman .


0 comments:

Post a Comment