JavaScript - An open source scripting language, it allows the creation of dynamic web page content.  Home Web Programming JavaScript Shaking Images With Javascript

Shaking Images With Javascript


Shaking Images With Javascript   

Click on the image to see how it works

Put the below code inbetween the <head></head> ::

<style>
.shakeimage{
position:relative
}
</style>
<script language="JavaScript1.2">
var rector=3
var stopit=0
var a=1
function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}
function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector
}
else{
shake.style.left=parseInt(shake.style.left)-rector
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",50)
}
function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}
</script>

Put this code in your img

src="/img_articles/6850/something.something" class="shakeimage" onMouseover="init(this);rattleimage()" onMouseout="stoprattle(this);top.focus()" onClick="top.focus()"


Author's URL: Arnab_Ghosh
JavaScript - An open source scripting language, it allows the creation of dynamic web page content. More JavaScript Tutorials: Featured Materials | Fresh Materials | More JavaScript Tutorials at LearnPHP.org

Reader's comments
comments sravan September 20, 2010 says:
sravan
Reply
Add comments to "Shaking Images With Javascript"

Captcha