/* SPRITE STYLE IMAGE ROLLOVER
 *
 * One very wide gif image displayed as a background image which contains all 
 * map rollover variations is dynamically repositioned onmouseover. The viewport
 * is the width of one map image, meaning the remainder are off-screen.
 * The mapId is multiplied with the mapImageWidth to scroll the background image by 
 * the required amount to position it within the viewport.
 *
 *    default: [#]######
 *    mapId=2: ##[#]####
 *    mapId=4: ####[#]##
 *     etc..
 * 
 * Note that the background is attached to the <img> with id=dajwMap
 * and src= to a transparent GIF image. The width attribute specifies
 * the viewport width.
 * 
 * Producing one large gif of 39kb loads quicker over one http txn 
 * rather than 7 smaller gifs with a sum of 45kb.
 *
 * Dominic Winsor, get2dom.com
*/

// map element and default width
var dajwMap;
var dajwMapImageWidth;

// initialise the rollover map variables
// called on Image.onload() like so: <img onload="ocuHighlightInit(this)"
function dajwHighlightInit(mapRef)
{
	dajwMap = mapRef;
	dajwMapImageWidth = dajwMap.width;
}


// scroll element background image x position by required amount
function dajwHighlight(mapId)
{ 
	if(dajwMap) dajwMap.style.backgroundPosition = (mapId) ? -(dajwMapImageWidth*mapId)+"px 0" : "0px 0px"; 
}