Featured Scripts
& Tutorials

Image Watermark Script

PHP Automatic Thumbnail Maker

JavaScript Slideshow

Google Adwords PPC Calculator

Spider Tracks©

Server Log Search

SMTP FormMail

CSS Positioning Tutorial

RRAnimate© Floating Image Animation Script

RRAnimate© is a free JavaScript that allows website designers to decorate a webpage with an animated image. The script takes any image you select and lets it bounce around the screen like a game of Pong. And since the image floats underneath the contents of the page, it doesn't obscure anything or make the page difficult to read. It requires only that your webpage be valid HTML so that you can modify it to add some CSS code, which provides the "layering" effect that lets the image float behind everything else on the page. RRAnimate© is perfect for adding a holiday theme to a page or just enhance the feel of a fun webpage. Click here to see a demonstration.

While RRAnimate© doesn't really require advanced knowledge of HTML and CSS, it does make a great opportunity for novice web designers to get a better understanding of some very useful webpage design principles like CSS positioning and using z-index to stack content. I've also posted a CSS Positioning Tutorial that will give you a good foundation. Once you've got a grip on that, you can use RRAnimate© to learn how to manipulate CSS settings with JavaScript. From there, the possibilities are there for you to discover.