//User editable varriables.
// var thumbWidth = 256; // Width of the thumbnail in pixels - Default is 256.  Uncomment this to control width.
var thumbHeight = 196; // Height of the thumbnail in pixels - Default is 196.
var hOffset = 60; // Horizontal offset from cursor. - Default is 40. - Positive numbers push it right, negative numbers push it left.
var vOffset = -90; // Vertical offset from cursor. - Default is -10. - Positive numbers push it down, negative numbers push it up.
//End of user editable variables

var Alpha = document.getElementsByTagName("a"); // Assign all page anchors to an array named "Alpha".
var Sigma = document.getElementsByTagName("span"); // Assign all page spans to an array named "Sigma".
var imageTypes = /(\.jpg)|(\.jpeg)|(\.png)|(\.gif)|(\.bmp)/i // Regular expression madness - Checks to see if the regExp matches any common image file extentions.

for(i=0;i<Alpha.length;i++) // This is the loop where the magic happens
{
	Alpha[i].id="a"+i; // Assigns an id to each and every anchor on the page so we can call by array element number, or explicitly by id.  Not currently used.
	if (imageTypes.test(Alpha[i].href)==true)
	{
		Alpha[i].onmousemove=new Function("eventCap", "if (!eventCap) eventCap = window.event; ShowThumb(\"" + i + "\", eventCap);"); // This assignes the onmousemove function to each individual anchor tag.  The eventCap ensures compatability with IE and other W3C compliant browsers due to diffrent handling of event models.
		Alpha[i].onmouseout=new Function("HideThumb(\"" + i + "\");");
		Alpha[i].onclick=new Function("HideThumb(\"" + i + "\");"); // This line is only nessisary for firefox and other browsers, where the loaded image will become "stuck" when a user clicks a link, then uses the browser's back button to return to the page.
		
		document.write("<span style=\"visibility: hidden; border-style: solid; border-width: 1px; border-color: #bbbbbb; background: #ffffff;\" id=\"span"+i+"\" class=\"cursor\">"); //Creates new span, makes it invisible, and assignes it an id to match it's associated anchor tag
//		document.write("<img src=\""+Alpha[i]+"\" width=\""+thumbWidth+"\" height=\""+thumbHeight+"\"><br / class=\"cursor\">"); //populates span with thumbnail using height AND width.
		document.write("<img src=\""+Alpha[i]+"\" height=\""+thumbHeight+"\"><br>"); //populates span with thumbnail.
		document.write("</span>"); //close of hidden span
	}
}

function ShowThumb(ident, eventCap) // This makes the span visible and follows the cursor.
{
	var mySpan = "span" + ident;
	document.getElementById(mySpan).style.visibility="visible";
	document.getElementById(mySpan).style.left=eventCap.clientX+hOffset+"px";
	document.getElementById(mySpan).style.top=eventCap.clientY+vOffset+"px";
//	document.getElementById(mySpan).style.left=eventCap.screenX+hOffset;
//	document.getElementById(mySpan).style.top=eventCap.screenY+vOffset;
}

function HideThumb(ident) // This hides the span.
{
	var mySpan = "span" + ident;
	document.getElementById(mySpan).style.visibility="hidden";
}