Bookmark to del.icio.us
NS6+ IE5+ Opera 7+
:: Bouncing image script (single image version)
Description: Through absolute positioning, along with clever math calculations, Hass (a Dynamicdrive.com surfer) has created this great bouncing image script. It charges aimlessly through the page, hitting and refracting off the edges of your browser window. It does so even if the user scrolls the page (unlike a fault seen in many similar scripts out there). Spectacular...
Demo: Hard to miss...
Step 1: Download the following image file and upload it into your webpage directory (either by clicking it, or clicking it with the shift key depressed for NS users): Or, ignore this step if you wish to use your own image.
Step 2: Add the following into the <head> section of your page:
Step 3: Last by not least, copy the following into the <body> section of your page, outside any other tags. This contains the actual HTML codes used to display the bouncing image:
Configuring the script
The image to be bounced can be changed to your own. To do so, you'll need to edit not only the image src attribute inside Step 3, but also, four variables located at the top of the code in Step 2. One of the four variables also controls how long the ball remains visible on the screen.