// JavaScript Document

/* set base style of tip layers */
document.writeln('<div id="gbl_tip_layer"></div>');
document.writeln('<style type="text/css">');
document.writeln('#gbl_tip_layer { position:absolute; opacity:0.7; filter:Alpha(Opacity=70); }');
document.writeln('</style>');

/* set tip of image */
var gbl_tip_layer = document.getElementById('gbl_tip_layer');
var gbl_onview_img;

intObjTip();

/* mouse move */
	
if (window.navigator.userAgent.indexOf('Safari') >= 0)
{
	document.onmousemove = function (event)
	{
		if (gbl_onview_img)
		{
			var scrollX = window.pageXOffset;
			var scrollY = window.pageYOffset;
			gbl_tip_layer.style.left = scrollX + event.clientX + 8 + 'px';
			gbl_tip_layer.style.top  = scrollY + event.clientY - gbl_tip_layer.offsetHeight - 5 + 'px';
		}
	}
}
else
{
	document.onmousemove = function (event)
	{
		if (gbl_onview_img)
		{
			var ev = event || window.event;
			var scrollX = document.documentElement ? document.documentElement.scrollLeft : document.body.scrollLeft;
			var scrollY = document.documentElement ? document.documentElement.scrollTop : document.body.scrollTop;		
			gbl_tip_layer.style.left = scrollX + ev.clientX + 8 + 'px';
			gbl_tip_layer.style.top  = scrollY + ev.clientY - gbl_tip_layer.offsetHeight - 5 + 'px';
		}
	}
}

/* set tip to images with attribute 'tip' */
function intObjTip()
{
	var obj = document.getElementsByTagName('img');
	for (var i=0; i<obj.length; i++)
	{
		if (obj[i].getAttribute('tip') == null)
			continue;
		setObjTip(obj[i]);
	}
}

/* set tip for an object */
function setObjTip(obj)
{
	obj.onmouseover = function ()
	{
		gbl_onview_img = this;
		gbl_tip_layer.innerHTML = document.getElementById(this.getAttribute('tip')).innerHTML;
		gbl_tip_layer.style.display = 'block';
	}
	obj.onmouseout = function ()
	{
		gbl_onview_img = null;
		gbl_tip_layer.style.display = 'none';
		gbl_tip_layer.style.left = '0px';
		gbl_tip_layer.style.top  = '0px';
	}
}