Cara Mudah Membuat Efek Link dan Gambar Bergeser atau Gerak Di Blog

Memberi efek link dan gambar bergeser/gerak saat di sentuh kursor merupakan trik unik menarik pada blog yang saya akan bagikan kali, bagi anda yang senang dengan trik efek ada baiknya gunakan trik mudah dan menarik ini.

Trik link nudging ini cukup mudah dengan menggunakan CSS untuk membuat link dan juga gambar bergeser atau bergerak saat di sentuh kursor, lakukan petunjuk dibawah ini :

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://aliyfaizal.blogspot.com" class="link-nudge">Aliy Faizal</a>

Untuk membuat gambar bergeser gunakan kode dibawah ini

class="link-nudge"

contoh:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghSf6T5gCqlUSjM5S3GwYpBsf8O9u51dAvSDBpV25hJby6iiMfzqOZh4OxzDOBq5wpop3HD7Zx54CsWDUjuosTWYEjCpZVUDH9vyPRH0eQoAmxJqmAM0KNgzMr8E3YDy91du4_mnPViSs/s1600/Aliy+Faizal.jpg" alt="author"  class="link-nudge" />

Demikian tutorial blog yang dapat saya sampaikan kali ini, semoga dapat bermanfaat bagi blog atau Website anda. Jika ada yang kurang jelas, silahkan berkomentar dibawah. Terima kasih.