function initArrow (onPath, offPath) {
  // first, check if the image property exists
  if (document.images) {  
    // next, preload the rollover state of the image, and assign it an 'on' name
    upOn = new Image();
    upOn.src = onPath;

    // then, preload the off state of the image, and assign it an 'off' name
    upOff = new Image(); 
    upOff.src = offPath;
  }
}

// This function changes images to the rollover state (assigned above).
// It's called by the ONMOUSEOVER attribute of the HREF element.
function rollOn (imgName) {
  if (document.images) {
    document[imgName].src = upOn.src;
  }
}

// This function changes images to the off state (assigned above).
// It's called by the ONMOUSEOUT attribute of the HREF element.
function rollOff (imgName) {
  if (document.images) {
    document[imgName].src = upOff.src;
  }
}