function gebi(id) { return document.getElementById(id); }

var toolTip = gebi('toolTip');

function mousePageXY(e)
{
	var x = 0, y = 0;
	if (!e) e = window.event;
	if (e.pageX || e.pageY) {
		x = e.pageX;
		y = e.pageY;
	} else if (e.clientX || e.clientY) {
		x = e.clientX - document.documentElement.clientLeft + (document.documentElement.scrollLeft || document.body.scrollLeft);
		y = e.clientY - document.documentElement.clientTop + (document.documentElement.scrollTop || document.body.scrollTop);
	}
	return {"x": x, "y": y};
}

function showTip(e, msg, pos)
{
	if (toolTip == null) toolTip = gebi('toolTip');
	if (toolTip == null) return;
	var mCur = mousePageXY(e);
	if (pos == null) pos = '20;20';
	pos = '0;20';

	var coords = pos.split(';');

	toolTip.style.top = mCur.y + parseInt(coords[1]) + 'px';
	toolTip.style.left = mCur.x + parseInt(coords[0]) + 'px';

	toolTip.innerHTML = msg;
	toolTip.style.display = 'block';

}
function hideTip() {
	if (toolTip == null) toolTip = gebi('toolTip');
	if (toolTip == null) return;toolTip.style.display = 'none';
}

var spans = document.getElementsByTagName("SPAN");
for(i = 0; i < spans.length; i++) {
	if(spans[i].getAttribute('msg') != null) {
		spans[i].onmousemove = function(e) { showTip(e, this.getAttribute('msg'), this.getAttribute('coords')); }
		spans[i].onmouseout = hideTip;
	}
}

var imgs = document.getElementsByTagName("IMG");
for(i = 0; i < imgs.length; i++) {
	if(imgs[i].getAttribute('msg') != null) {
		imgs[i].onmousemove = function(e) { showTip(e, this.getAttribute('msg'), this.getAttribute('coords')); }
		imgs[i].onmouseout = hideTip;
	}
}