<!--
/*
author: Xinod | date: 14/01/07 | url: www.xinod.it/scripts/tooltip_gallery/index.php
this script is free to use as long as this copyright notice remains intact
*/

var xlPath='img'; // path to enlarged img
var dist=15; // horizontal distance from the cursor
var padd=5; // padding+border pop div;

var dfW=waitW=100; // default width while loading
var dfH=waitH=20; // default height while loading

// other reserved vars, do not modify/overwrite
var imgLoaded=false;
var dPadd=2*padd;
var d,vDoc,pDiv,pLoad,pTxt,pImg,bH,bW,mX,mY,scrX,scrY;

window.onload=function(){
	var d=document; if(!d.getElementById || !d.getElementsByTagName) return;
	vDoc=(d.documentElement && d.documentElement.clientWidth)?d.documentElement:d.body;

	pDiv=d.createElement('div');
	pDiv.setAttribute('id','pop');

	pLoad=d.createElement('div');
	pTxt=d.createTextNode('...Loading...');
	// comment the above line and decomment the one below if you are using an image to display loading activity,
	// set a valid path to your loading gif in pTxt.src and adjust waitW and waitH according to its width and height.
	// pTxt=d.createElement('img'); pTxt.src='loading.gif';
	pLoad.appendChild(pTxt);
	pDiv.appendChild(pLoad);

	pImg=d.createElement('img');
	pImg.style.display='none';

	pDiv.appendChild(pImg);
	d.body.appendChild(pDiv);

	imgs=d.getElementById('gallery').getElementsByTagName('img');
	for(var k=0;k<imgs.length;k++){
		imgs[k].onmouseout=xlHide;
		imgs[k].onmouseover=xlShow;
		imgs[k].onmousemove=xlGetCoords;
	}
}
function xlShow(e){
	if(!e) e=window.event;
	pLoad.style.display=pDiv.style.display='block';
	var source=(e.target)?e.target:e.srcElement;
	var fileName=xlPath+source.src.substring(source.src.lastIndexOf('/'));
	
	imgLoader=new Image();
	imgLoader.onload=function(){
		pLoad.style.display='none';
		pImg.src=this.src;
		pImg.style.display='block';
		imgLoaded=true;
		imgLoader.onload=null;
	}
	imgLoader.src=fileName;
}
function xlHide(){
	pDiv.style.display=pImg.style.display='none';
	pDiv.style.top='0px';
	pDiv.style.left='0px';
	imgLoaded=false;
}
function xlGetCoords(e){
	if(!e) e=window.event;
	bW=(vDoc.clientWidth)?vDoc.clientWidth:self.innerWidth;
	bH=(vDoc.clientHeight)?vDoc.clientHeight:self.innerHeight;
	scrX=(window.scrollX)?window.scrollX:vDoc.scrollLeft;
	scrY=(window.scrollY)?window.scrollY:vDoc.scrollTop;
	mX = e.clientX;
	mY = e.clientY;	
	dfW=(imgLoaded)?imgLoader.width:waitW;
	dfH=(imgLoaded)?imgLoader.height:waitH;
	pDiv.style.left=(((mX+dfW+dPadd+dist)<bW)?mX+dist:mX-dfW-(dist+dPadd))+scrX+'px';
	pDiv.style.top=(((mY+dfH+dPadd)<bH)?mY:bH-(dfH+dPadd))+scrY+'px';
}
//-->