Cara membuat Link Nudging dengan CSS

Pasti sudah bisa di tebak dari judulnya,yupz memang sudah kelihatan kalau malam ini saya akan memberikan tutorial 'Cara membuat Link Nudging dengan CSS',mungkin sebagian udah pada tau maksudnya link lugning,tapi kalo belum tau biar saya jelasin deh,yang saya maksud 'Link Nudging adalah,penambahan efek bergoyang pada link yang disorot oleh kursor kamu,ok untuk demonya silahkan kamu lihat demonya dibawah ini

Ini adalah demo Link Nudging

gimana lumayan baguskan,dan pastinya enggak akan mempengaruhi berat blog,untuk cara2 membuatnya dibawah ini

Kode CSS

#animateList li a {
-moz-transition: all 0.26s ease-out;  /* FF4+ */
-o-transition: all 0.26s ease-out;  /* Opera 10.5+ */
-webkit-transition: all 0.26s ease-out;  /* Saf3.2+, Chrome */
-ms-transition: all 0.26s ease-out;  /* IE10? */  

-moz-transition-duration: 1s;}
#animateList li a:hover {
padding-left: 100px;
} 

Kode HTML

<div id="animateList">
<li><a href="#">Tautan Satu</a></li>
<li><a href="#">Tautan Dua</a></li>
<li><a href="#">Tautan Tiga</a></li>
<li><a href="#">Tautan Empat</a></li>
</div>

 Ok,itu aja kodenya,semoga berhasil dan salam sukses for u