var tooltipElementTag = '*';
var tooltipElementX = -20;
var tooltipElementY = 20; 
var myWidth = 0, myHeight = 0;
var posY = null, posX = null;

tooltipClass ={ name : "tooltip", offsetX : tooltipElementX, offsetY : tooltipElementY, tooltipElement : null}

tooltipClass.init = function (){
	var tooltipElementURI = "http://www.w3.org/1999/xhtml";
	
	if(!tooltipElementID){ 
		var tooltipElementID = "tooltip";
	}
	var tooltipElementContainer = document.getElementById(tooltipElementID);
	
	if(!tooltipElementContainer){
		tooltipElementContainer = document.createElementNS ? document.createElementNS(tooltipElementURI, "div") : document.createElement("div");
		tooltipElementContainer.setAttribute("id", tooltipElementID);
		document.getElementsByTagName("body").item(0).appendChild(tooltipElementContainer);
	}
	if (!document.getElementById) 
		return;
	this.tooltipElement = document.getElementById (this.name);
	
	if (this.tooltipElement) document.onmousemove = function (evt){tooltipClass.move (evt)};
	
	var a, anchorTitle;
	var anchors = document.getElementsByTagName(tooltipElementTag);
	
	for (var i = 0; i < anchors.length; i ++){
		a = anchors[i];
		anchorTitle = a.getAttribute("id");
		if(anchorTitle){
			if(anchorTitle.indexOf('_tip') >= 0){
				a.setAttribute("tooltipElementTitle", a.getAttribute("title"));
				a.removeAttribute("title");
				
				a.onmouseover = function(){
					if( typeof( window.innerWidth ) == 'number' ){
						//Non-IE
						myWidth = window.innerWidth;
						myHeight = window.innerHeight;
					}else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ){
						//IE 6+ in 'standards compliant mode'
						myWidth = document.documentElement.clientWidth;
						myHeight = document.documentElement.clientHeight;
					}else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ){
						//IE 4 compatible
						myWidth = document.body.clientWidth;
						myHeight = document.body.clientHeight;
					}
					tooltipClass.show(this.getAttribute('tooltipElementTitle'))
				};
				a.onmouseout = function(){tooltipClass.hide()};
			}
		}
	}
}

tooltipClass.move = function (evt){
	var x = 0, y = 0;
	var width = 0,  height = 0;
	
	if (document.all){
		//IE
		x = (document.documentElement && document.documentElement.scrollLeft) ? document.documentElement.scrollLeft : document.body.scrollLeft;
		y = (document.documentElement && document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop;
		x += window.event.clientX;
		y += window.event.clientY;
	} 
	else{
		//Good Browsers
		x = evt.pageX;
		y = evt.pageY;
	}
	if (typeof evt == 'undefined'){ 
		myEvent = window.event; 
	} 
	else{
		myEvent = evt;
	} 
	posX = myEvent.clientX;
	posY = myEvent.clientY;
	width = this.tooltipElement.offsetWidth;	
	height = this.tooltipElement.offsetHeight;
	if((x + this.offsetX) <= 2){
		this.tooltipElement.style.left = 2 + "px";
	}
	else if(x >= (myWidth - width - this.offsetX - 2)){
			this.tooltipElement.style.left = (myWidth - width - 2) + "px";
		}	
		else{
			this.tooltipElement.style.left = (x + this.offsetX) + "px";
		}
	if(posY >= (myHeight - height - this.offsetY)){
		this.tooltipElement.style.top = (y - height - this.offsetY) + "px";
	}
	else{
		this.tooltipElement.style.top = (y + this.offsetY) + "px";
	}
}
tooltipClass.show = function (text){
	if (!this.tooltipElement) 
		return;
	this.tooltipElement.innerHTML = text;
	this.tooltipElement.style.visibility = "visible";
}
tooltipClass.hide = function (){
	if (!this.tooltipElement) 
		return;
	this.tooltipElement.innerHTML = "";
	this.tooltipElement.style.visibility = "hidden";
}
window.onload = function (){
	tooltipClass.init ();
}