Cara membuat Link dan Gambar bergoyang

Memberi efek link bergeser/goyang saat di sentuh kursor merupakan trik unik menarik pada blog yang saya akan bagikan  pada malam ini, karena banyak sobat yang menanyakan bagaimana membuat link bergeser ketika disentuh kursor? dan pada kesempatan kali ini saya akan menjawab pertanyaan sobat di artikel yang satu ini, trik link nudging ini menggunakan css untuk membuat link dan juga gambar bergeser saat di sentuh kursor, mau coba?

• login ke blogger
• pilih template >> edit html
• cari kode ]]></b:skin>
• copy paste kode dibawah ini tepat diatas kode ]]></b:skin>

 /*--- efek link begeser ---*/
.link-nudge  {
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
}
.link-nudge:hover  {
margin-left: 25px;
padding-left: 5px;
}

CARA PENGGUNAANNYA

• untuk membuat link bergeser gunakan kode dibawah ini

class="link-nudge"

contoh: 

<a href="http://depermana-share.blogspot.com" class="link-nudge">depermana12</a>

• untuk membuat gambar bergeser gunakan kode dibawah ini

 class="link-nudge"

contoh:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHS8RuNg5bFLq0-8v4J6IrW2KxYXCechRREUQMW6aOqI7Wz26sHBDVgM4-QNA0EGcc9ncVHxNOqUMsVayTr0FebATxirwmNwWvybWrt2zIbQkmSsFjKZKZQTJfQ4VwKEiWbOhX0yywR8Da/s1600/computer.png" alt="komputer gw"  class="link-nudge" /> 

©2013 copyright