var offsetfrommouse=[50,50]; //image x,y offsets from cursor position in pixels. Enter 0,0 for no offset
		var displayduration=0; //duration in seconds image should remain visible. 0 for always.
		var currentimageheight = 270;	// maximum image size.
		
		/*if (document.getElementById || document.all){
			document.write('<div id="trailimageid">');
			document.write('</div>');
		}*/
		
		function gettrailobj(){
		if (document.getElementById)
		return document.getElementById("LargeImageHolder").style
		else if (document.all)
		return document.all.trailimagid.style
		}
		
		function gettrailobjnostyle(){
		if (document.getElementById)
		return document.getElementById("LargeImageHolder")
		else if (document.all)
		return document.all.trailimagid
		}
		
		
		function truebody(){
		return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
		}
				
		function showtrail(imgSrc,width,height,hideiframe){
			if (!height) height = 100;
			if (!hideiframe){ 
				hideiframe = '<!--[if lte IE 7]><iframe style="height:'+height+'%;"></iframe><![endif]-->';
			}else{
				hideiframe = '';
			}

			newHTML = '<div id="followdiv" style="position:absolute; border:1px solid #999999; background-color:#ffffff;  visibility: hidden;z-index:999;">';
					newHTML = newHTML + hideiframe + '<div id="waitdiv" align="center" style="padding: 0 0 0 0 ;">';
					
					
						//newHTML = newHTML + '<img src="' + imgSrc + '" border="0" style=""></div>';
						newHTML = newHTML + '<img src="' + imgSrc + '" border="0" style=""></div>';
					
					
					
			newHTML = newHTML + '</div>';
			gettrailobjnostyle().innerHTML = newHTML;
			gettrailobj().display="inline";
		}
		
		
		function hidetrail(){
			gettrailobj().innerHTML = " ";
			gettrailobj().display="none"
			//document.onmousemove=""
			//gettrailobj().left="-500px"
		
		}

//Change image
function change(ImageSource,width) {
    window.document.mediumImageJS.src = ImageSource;
	window.document.mediumImageJS.width = width;
	//window.document.mediumImage.height = height;
}	


var divName = 'followdiv'; // div that is to follow the mouse
                       // (must be position:absolute)
var offX = 10;          // X offset from mouse position
var offY = 10;          // Y offset from mouse position

function mouseX(evt) {if (!evt) evt = window.event; if (evt.pageX) return evt.pageX; else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ?  document.documentElement.scrollLeft : document.body.scrollLeft); else return 0;}
function mouseY(evt) {if (!evt) evt = window.event; if (evt.pageY) return evt.pageY; else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); else return 0;}

function follow(evt) {
	if (document.getElementById) {
		var obj = document.getElementById(divName).style; obj.visibility = 'visible';
		obj.left = (parseInt(mouseX(evt))+offX) + 'px';
		obj.top = (parseInt(mouseY(evt))+offY) + 'px';
	}
}
document.onmousemove = follow;


// Hide all the image thumbnail Div's (available ids are required [idList])
function hideall(idList) {
	
	var idArray = idList.split(",");
	for(var i=0; i<idArray.length; i++){
		//Set display - none by accessing idArray[i];
		var idName = 'colourset_'+idArray[i];
		var allElements = document.getElementById(idName);
		allElements.style.display = "none";
	}
}

// Show / Hide Colours
function toggleColours(idList,el) {
	
	//Pass the available ids to the function
	hideall(idList);
	
	var myelement = document.getElementById(el);
	var myimg = document.getElementById("btn-" + el);
	
	if( !myelement.style.display || myelement.style.display == "none" ) {
		myelement.style.display = "inline";
	} else {
		myelement.style.display = "none";
	}
}

function swap(colourIndex,imgIndex) {
	// if the dspID (imgIndex) isnt passed in then use the value set in the form	
	if (!imgIndex) imgIndex = document.holdJS.medDspID.value;
	
	// change the medium image
	document['mediumImageJS'].src = aryImages[colourIndex][imgIndex];
}
