I made this plug in while I was playing arround with jQuery. I am trying to transfer my flash skills to html. Learning actionscript started with a bouncing ball class. Therefore I tried to create the same in jQuery.

And here it is the boucingelement plugin. It was fun to make and you could do a lot of useless stuf with it. Like the form example on this page. Click in one of the input fields to start the plugin

$('#password').bouncingElement();

or with parameters

$('#password').bouncingElement({ xpos: 80, ypos: 95, speedX: 1, speedY: 3, fps: 15 });

The main code is very basic as you can see in the snippet below. A simple setInterval functionin the plugin provides the animation you can change the speed by setting the fps parameter or or the speedX/ speedY parameter. It is important to position the bouncing elements absolute.

// change the position
o.xpos += o.speedX;
o.ypos += o.speedY;
ball.css("left", o.xpos);
ball.css("top", o.ypos);

// reverse the speed if the element hits the boundary
if (o.xpos < 0 || o.xpos > (canvas.width() - ball.width()))
{
o.speedX *= -1;
}

if (o.ypos < 0 || o.ypos > (canvas.height() - ball.height()))
{
o.speedY *= -1;
}

You can get the plugin and an example here.