Tutorial - Shake Image Hover


CONTOH IMAGE SHAKE HOVER:
*Cube halakan cursor kat gambar di bawah ni ,


                  1. Dashboard > Design > Add A Gadget > HTML/JavaScript       2. Copy code kat bawah ni dan paste kan di bahagian tadi :
<style>.shakeimage{position:relative}</style><script language="JavaScript1.2">/*Shake image script (onMouseover)-© Dynamic Drive (www.dynamicdrive.com)For full source code, usage terms, and 100's more DHTML scripts, visit http://dynamicdrive.com*///configure shake degree (where larger # equals greater shake)var rector=3///////DONE EDITTING///////////var stopit=0var a=1function init(which){stopit=0shake=whichshake.style.left=0shake.style.top=0}function rattleimage(){if ((!document.all&&!document.getElementById)||stopit==1)returnif (a==1){shake.style.top=parseInt(shake.style.top)+rector+"px"}else if (a==2){shake.style.left=parseInt(shake.style.left)+rector+"px"}else if (a==3){shake.style.top=parseInt(shake.style.top)-rector+"px"}else{shake.style.left=parseInt(shake.style.left)-rector+"px"}if (a<4)a++elsea=1setTimeout("rattleimage()",50)}function stoprattle(which){stopit=1which.style.left=0which.style.top=0}</script><img src="URL GAMBAR" class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" onClick="top.focus()">
     Yang zaty highlight kan warna MERAH tu, masukkan URL GAMBAR yg nak di gegarkan..  kalau dh siap, tekan je SAVE k. hah .. bergegar tak gambar tu ? hihi

Thank You sebab baca entry ni . Jangan lupa like dan komen .

4 comments:

✉ ¥ana Fauzi ✉ said...

Nice tutorial , pandai diaa aihh:D

Najla Najihah said...

Whaa :) terima kasih zaty . tuto yg berguna ! Nnti saya nak buat ;)