if (document.images)
{
  // Define containers for images
  var about_off = new Image();
  var about_on = new Image();
  var projects_off = new Image();
  var projects_on = new Image();
  var status_off = new Image();
  var status_on = new Image();
  var systems_off = new Image();
  var systems_on = new Image();
  var resources_off = new Image();
  var resources_on = new Image();
  var links_off = new Image();
  var links_on = new Image();

  // Point Image objects to objects on disk.
  //
  // Since the names of objects and actual disk
  // images are the same, there should be an
  // easier way to do this...  Ideas?
  // I'm thinking of an array of name strings
  // and a for loop.
  about_off.src = "/images/about_off.png";
  about_on.src = "/images/about_on.png";
  projects_off.src = "/images/projects_off.png";
  projects_on.src = "/images/projects_on.png";
  status_off.src = "/images/status_off.png";
  status_on.src = "/images/status_on.png";
  systems_off.src = "/images/systems_off.png";
  systems_on.src = "/images/systems_on.png";
  resources_off.src = "/images/resources_off.png";
  resources_on.src = "/images/resources_on.png";
  links_off.src = "/images/links_off.png";
  links_on.src = "/images/links_on.png";
}


// Image on
function on(name,target) {
	if (target)
		document[target].src = eval(name + '_on.src');
	else
		document[name].src = eval(name + '_on.src');  
}

// Image off
function off(name,target) {
	if (target)
		document[target].src = eval(name + '_off.src');
	else
    		document[name].src = eval(name + '_off.src');
}

