var shiftImgClass = function(o){
	var mapbg, id;
	//set id  variable to the 'id' of the area on the map where the mouse is positioned
	id = o.id;
	//the master object where the image map is used in this case a clear gif with the id 'mapimg'
	mapbg = document.getElementById('mapimg');
	//if the className and the id match reset the class to the default state -or- shift the background image to the correct position by using the new class value
	if(id == mapbg.className){
		mapbg.className='mapbase'; 
	}
	else{
		mapbg.className=id;
	}
}

var readMap = function(){
	 // get array of map area tags
	 var map=document.getElementsByTagName('area');
	 for(var i=0;i<map.length;i++){
		 //add onmouseover and onmouseout event functions
		 map[i].onmouseover=function(){shiftImgClass(this);};
		 map[i].onmouseout=function(){shiftImgClass(this);};
	 }
}
 
window.onload=function(){
	readMap();
}