Sobat pasti pernah
melihat diberbagai blog sahabat yang apabila link tersebut tersentuh
kursor maka link tersebut akan bergerak.. Nah….!!!sekarang ini, saya
akan memandu anda bagaimana cara membuat nya….gampang ko sob,,,,,
1. Cara ini menggunakan jquery, jadi penggunaan nya sangatlah mudah. kita langsung aja ke TKP
1. Login ke Blog anda
2. Klik Tab Template
3. Kemudian, klik Edit HTML
4. Centang Expand Template Widget
5. Ok, sekarang sobat cari kode ini </head> ,Copy Kode Dibawah dan Letakkan di atas </head>
<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() {
$('a').hover(function() { //mouse in
$(this).animate({ marginLeft: '12px' }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});</script>
1. Cara ini menggunakan jquery, jadi penggunaan nya sangatlah mudah. kita langsung aja ke TKP
1. Login ke Blog anda
2. Klik Tab Template
3. Kemudian, klik Edit HTML
4. Centang Expand Template Widget
5. Ok, sekarang sobat cari kode ini </head> ,Copy Kode Dibawah dan Letakkan di atas </head>
<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() {
$('a').hover(function() { //mouse in
$(this).animate({ marginLeft: '12px' }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});</script>
6. Save Template
2. Cara
ini menggunakan kode HTML
1. Login ke Blog anda
2. Klik Tata Letak
3. Add Gadget ,Copy kode di
bawah ini
<script
src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js'
type='text/javascript'></script><script type='text/javascript'>
$(document).ready(function() { $('a').hover(function() {
$(this).animate({ marginLeft: '10px' }, 400); }, function() {
$(this).animate({ marginLeft: 0 }, 400); }); });</script>
4. Save Widget
Semoga Bermanfaat
Cara Membuat Link Bergoyang Ketika Disorot Mouse
9 Out Of 10 Based On 10 Ratings. 9 User Reviews.
0 Comment:
Post a Comment