Saturday 20 April 2013

Tutorial : Image Hover 2 (Vibrate)




Assalamualaikum . Tahu kan , bila cursor sentuh gambar , gambar akan bergetar . Joget joget macam tu . Hahaha . Jom aimi ajarkan macam mana nak buat . 

1. Dashboard > Template
2. Press F3 dan cari code <style> atau </style>
3. Copy code bawah ni 
<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>
4. Paste di bawah code yang korang cari tadi
5. Then , copy code ni pulak
<imgsrc="URLIMAGE"width="200"height="200"class="shakeimage"onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" onClick="top.focus()">
6. Pastekan kat mana - mana bahagian yang korang nak .
7. Preview dan save .

oren : URL image
biru : lebar image
hijau : tinggi image 

Credit to : Fatin

0 comments: