//	Simple Image Trail script- By JavaScriptKit.com

var offsetfrommouse=[15,10]; //image x,y offsets from cursor position in pixels.

var myimageheight = 250;

var myimagewidth = 250;

if (document.getElementById || document.all){

	document.write('<div id="DynPreviewPlace">');

	document.write('</div>');

}

function gettrailobj(){

if (document.getElementById)

return document.getElementById("DynPreviewPlace").style

else if (document.all)

return document.all.DynPreviewPlace.style

}

function gettrailobjnostyle(){

if (document.getElementById)

return document.getElementById("DynPreviewPlace")

else if (document.all)

return document.all.DynPreviewPlace

}

function truebody(){

return (!window.opera && document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

}

function showtrail(imagename,title,width,height){

	document.onmousemove=followmouse;

		( height == 0 ) ? height = myimageheight: '';

		width+=15

		height+=30

		myimageheight = height

		myimagewidth = width 

		newHTML = '<div class="DynPreviewWraper" style="width:225px;"><div id="DynPreviewContainer"><div class="DynPreviewLoader"><div align="center">Loading preview...</div><div class="DynPreviewLoaderBg"><div id="DynProgress"> </div></div></div></div>';

		newHTML = newHTML + '<h2 class="DynPreviewTitle">' + ' '+title + '</h2>'

    newHTML = newHTML + '<img onload="javascript:remove_loading();" src="' + imagename + '" class="DynPreviewTempLoad" style="width:215px; alt="" />';

		newHTML = newHTML + '<!--[if lte IE 6.5]><iframe></iframe><![endif]--></div>'; 	

		gettrailobjnostyle().innerHTML = newHTML;

		gettrailobj().display="block";

	

}

function hidetrail(){

	gettrailobj().innerHTML = " ";

	gettrailobj().display="none"

	document.onmousemove=""

	gettrailobj().left="-400px"

}

function followmouse(e){

	var xcoord=offsetfrommouse[0]

	var ycoord=offsetfrommouse[1]

	var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15

	var docheight=document.all? Math.min(truebody().scrollHeight, truebody().clientHeight) : Math.min(window.innerHeight)

	if (typeof e != "undefined"){

		if (docwidth - e.pageX < myimagewidth + 2*offsetfrommouse[0]){

			xcoord = e.pageX - xcoord - myimagewidth;

		} else {

			xcoord += e.pageX;

		}

		if (docheight - e.pageY < (myimageheight + 110)){

			ycoord += e.pageY - Math.max(0,(110 + myimageheight + e.pageY - docheight - truebody().scrollTop));

		} else {

			ycoord += e.pageY;

		}

	} else if (typeof window.event != "undefined"){

		if (docwidth - event.clientX < myimagewidth + 2*offsetfrommouse[0]){

			xcoord = event.clientX + truebody().scrollLeft - xcoord - myimagewidth;

		} else {

			xcoord += truebody().scrollLeft+event.clientX

		}

		if (docheight - event.clientY < (myimageheight + 110)){

			ycoord += event.clientY + truebody().scrollTop - Math.max(0,(110 + myimageheight + event.clientY - docheight));

		} else {

			ycoord += truebody().scrollTop + event.clientY;

		}

	}

	var docwidth=document.all? truebody().scrollLeft+truebody().clientWidth : pageXOffset+window.innerWidth-15

	var docheight=document.all? Math.max(truebody().scrollHeight, truebody().clientHeight) : Math.max(document.body.offsetHeight, window.innerHeight)

	if(ycoord < 0) { ycoord = ycoord*-1; }

	gettrailobj().left=xcoord+"px"

	gettrailobj().top=ycoord+"px"

}

var t_id = setInterval(animate,20);

var pos=0;

var dir=2;

var len=0;

function animate(){

   var elem = document.getElementById('DynProgress');

   if(elem != null) {

   if (pos==0) len += dir;

   if (len>32 || pos>79) pos += dir;

   if (pos>79) len -= dir;

   if (pos>79 && len==0) pos=0;

}

}

function remove_loading() {

   this.clearInterval(t_id);

   var targelem = document.getElementById('DynPreviewContainer');

   targelem.style.display='none';

   targelem.style.visibility='hidden';

   var t_id = setInterval(animate,60);

}

