0

Hi! I am trying to make an element shake, and I have tried to make a function in JavaScript, but it won't work.
Here is the test page, used only for testing. It is the Genious test div that I want to shake. Here is the code:

function Shake(Pow){
    setTimeout("Shake(3);",100);
    var co = 1;
    switch(co){
        case 1:
             document.getElementById('genious').style.left-=Math.random()*Pow;
            break;
        case 2:
            document.getElementById('genious').style.left+=Math.random()*Pow;
            break;
        case 3:
            document.getElementById('genious').style.top-=Math.random()*Pow;
            break;
        case 4:
            document.getElementById('genious').style.top+=Math.random()*Pow;
            break;
    }
    if(co<4){
        co++;
    }else{
        co = 1;
    }
}

This is how I start it all:

<body onload="Shake(3);">

I get this notice in firebug:
Error in parsing value for 'left'. Declaration dropped.

So please take a overlook and tell me what I have done wrong! Thanks!

1
Contributor
1
Reply
3
Views
7 Years
Discussion Span
Last Post by ErlendHL
0

Now it sort of works. Current code:

function Shake(Pow){
                setTimeout("Shake(3);",100);
                var co = 1;
                var xcoor = document.getElementById('genious').style.left.replace('px','');
                var ycoor = document.getElementById('genious').style.top.replace('px','');
                switch(co){
                    case 1:
                        document.getElementById('genious').style.left=(xcoor-Math.random()*Pow)+"px";
                        break;
                    case 2:
                        document.getElementById('genious').style.left=(xcoor+Math.random()*Pow)+"px";
                        break;
                    case 3:
                        document.getElementById('genious').style.top=(ycoor-Math.random()*Pow)+"px";
                        break;
                    case 4:
                        document.getElementById('genious').style.top=(ycoor+Math.random()*Pow)+"px";
                        break;
                }
                if(co<4){
                    co++;
                }else{
                    co = 1;
                }
            }

The problem now is: The div seems unaffected by its "left", and the "left" just decreases, which means that co always is 1...

EDIT: Now I changed the style of 'genious' to position:asolute, and it now sort of works, the only thing is to change co.. why won't that work?

EDIT2: Aww I did not see. var co = 1 is the problem.
So now this is solved. Sorry for posting! lol

Edited by ErlendHL: Solved!

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.