Rollover.js

/*
 *  Rollover
 *
 *  Encapsulate a simple image rollover as an object.
 *
 *  Example of use:
 *
 *      <script type="text/javascript" src="Rollover.js"></script>
 *      <script type="text/javascript">
 *          r = new Rollover("on.gif");
 *      </script>
 *      
 *      <a href="#" onmouseover="r.over('i')" onmouseout="r.out('i')">
 *          <img id="i" src="off.gif" alt="" />
 *      </a>
 *
 *  Optionally, you can also specify the image name when you create the
 *  Rollover object. This binds a Rollover to a particular image and
 *  removes the need to specify the image name each time the Rollover
 *  functions are called.
 *
 *  Afternoon <noon at aftnn.org>, 2004
 *
 */

function Rollover(overSrc, name) {
    this.over_frame = new Image();
    this.off_frame = new Image();

    this.name = name;

    // preload rollover frame
    this.over_frame.src = overSrc;
}

Rollover.prototype.over = function (img) {
    if (!img && this.name) img = this.name;
    this.off_frame.src = document.images[img].src;
    document.images[img].src = this.over_frame.src;
}

Rollover.prototype.out = function (img) {
    if (!img && this.name) img = this.name;
    document.images[img].src = this.off_frame.src;
}