
// Bill Weinman's Common JavaScript Rollover Engine
// As described in "Creative HTML Design", by Lynda and Bill Weinman
// (c) 1997 Bill Weinman
// 
// You are free to use this script, and modify it to 
// your heart's content. You must leave this entire header
// --including this notice--intact, and make sure there 
// is a reference to our web site: <http://www.htmlbook.com/>. 
//
// Version 1.0.  First release with Creative HTML Design
//
// Requires the following variables to be defined in the HTML document: 
//
// okay = false       This prevents the script from running prematurely
// rtype              "highlighting", "pointing", or "slideshow"
// imagenames array   All the base imagenames
// suffixes           imagename suffix Used for highlighting rollovers
// path               path to images (must end in "/")
// ext                filename extension for images (e.g., ".gif")
//
// Initialization Instructions:
// ----------------------------
// Initialization is different for each of the various types of rollovers. 
// 
// "highlighting" type rollovers:
//
//     These are the most common types of rollovers. As your mouse 
//     passes over each image, that image is replace by a "highlighted" 
//     version. 
//
//     The "imagenames" array is used for two purposes: each name in the 
//     array must also match the NAME attribute for the corresponding 
//     IMG tag. The "suffixes" array is used to complete the filename 
//     for each image: the first value is added for onMouseOver events, 
//     and the second is added for onMouseOut events. 
// 
// "pointing" type rollovers:
//
//     As your mouse passes over each link, an image points at that 
//     link. 
//
//     The "imagenames" array uses just one image name, for the 
//     "pointing" image.
// 
// "slideshow" type rollovers:
//
//     As your mouse passes over each link, an image changes in one 
//     location, like a slideshow. 
//
//     The "imagenames" array is used for the names of all the images. 
// 


function roll_init()
{
// get the variables
var_init();  // this calls the function from the web page

// find out what browser this is
with(navigator) {
  code = appCodeName; 
  app = appName; 
  version = appVersion; 
  iver = parseInt(version); 
  ua = userAgent;
  }

// these are from the web page too. 
son  = suffixes[0];  
soff = suffixes[1];

// ua string is a generalized printable string
uastring = app + " " + iver;

// this will work in "Mozilla" 3+ (includes MSIE 4)
//if ( code == "Mozilla" && iver >= 3 )  okay = true;
//else okay = false; 

// Modified by Micky Chen 
if ( document.images )  okay = true;
else okay = false; 


// this uses eval to create variables 
// ... and to pre-load the images. 
if (okay){

  if (rtype == "highlighting") {
    for (var i = 0; i < imagenames.length; i++) {
      var name = imagenames[i];
      var ion  = "r" + name + "on";
      var ioff = "r" + name + "off";
      eval(ion  + " = new Image()");
      eval(ion  + ".src = '" + path + name + son  + ext + "'");
      eval(ioff + " = new Image()");
      eval(ioff + ".src = '" + path + name + soff + ext + "'");
      }// end -- for (var i = 0; i < imagenames.length; i++)
    }// end if (rtype == "highlighting")

  if (rtype == "pointing") {
    blank = new Image();
    on  = new Image();
    on.src  = path + imagenames[0] + ext;
    }// end -- if (rtype == "pointing")

  if (rtype == "slideshow") {
    blank = new Image();
    for (var i = 0; i < imagenames.length; i++) {
      var name = imagenames[i];
      eval("r" + name  + " = new Image()");
      eval("r" + name  + ".src = '" + path + name + ext + "'");
      }// end -- for (var i = 0; i < imagenames.length; i++)
    }// end -- if (rtype == "slideshow")

  }// end -- if (okay)

}

// the onMouseOver entry point
function over(imgname)
{
if (!okay) return true; // just leave unless okay

// swap in the "on" image
if (rtype == "highlighting")
  eval("document." + imgname + ".src = r" + imgname + "on.src");
if (rtype == "pointing") {
  eval("blank.src = document." + imgname + ".src");
  eval("document." + imgname + ".src = on.src");
  }
if (rtype == "slideshow") {
  blank.src = document.rollover.src;
  eval("document.rollover.src = r" + imgname + ".src");
  }
return true;
}

// the onMouseOut entry point
function out(imgname)
{
if (!okay) return true; // just leave unless okay

// swap in the "off" image
if (rtype == "highlighting")
  eval("document." + imgname + ".src = r" + imgname + "off.src");
if (rtype == "pointing")
  eval("document." + imgname + ".src = blank.src");
if (rtype == "slideshow") {
  document.rollover.src = blank.src;
  }
return true;
}


