How to put shake effect on image?

Passo 1: Coloque o seguinte código antes <head> e </ head>
    <style>
    .shakeimage{
    position:relative}
    </style>

    <script language=”JavaScript1.2”>
    //configure shake degree (where larger # equals greater shake)
    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+”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++
    else
    a=1
    setTimeout(“rattleimage()”,50)}
    function stoprattle(which){
    stopit=1
    which.style.left=0
    which.style.top=0}
    </script>

Passo 2: coloque o seguinte código dentro da tag <img> de todas as imagens que deseja que o efeito seja aplicado:
    class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()” onClick=”top.focus()”

Aqui está um exemplo:
    <img src=”IMAGE URL” class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()”onClick=”top.focus()”>

Substitua "IMAGE URL" pela URL da imagem:
    <img src”{image:sidebar}” class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()”onClick=”top.focus()”>

    <img src”http://static.tumblr.com/9wzbixa/ZpJlwjen8/banner.png” class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()”onClick=”top.focus()”>


Tutorial original por Jada (http://neudest.tumblr.com/)


x ----------------------------------------------------------------------------------------------------------------------------------- x


Step 1: Put the following code before <head> and </head>
    <style>
    .shakeimage{
    position:relative}
    </style>

    <script language=”JavaScript1.2”>
    //configure shake degree (where larger # equals greater shake)
    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+”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++
    else
    a=1
    setTimeout(“rattleimage()”,50)}
    function stoprattle(which){
    stopit=1
    which.style.left=0
    which.style.top=0}
    </script>

Step 2: Put the following code inside the <img> tag of all the images you want the effect to be applied on:
    class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()” onClick=”top.focus()”

Here’s an example:
    <img src=”IMAGE URL” class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()”onClick=”top.focus()”>

Replace “IMAGE URL” with the url of the image:
    <img src”{image:sidebar}” class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()”onClick=”top.focus()”>

    <img src”http://static.tumblr.com/9wzbixa/ZpJlwjen8/banner.png” class=”shakeimage” onMouseover=”init(this);rattleimage()” onMouseout=”stoprattle(this);top.focus()”onClick=”top.focus()”>


Original tutorial by Jada (http://neudest.tumblr.com/)