function drawDlg(tipTtle,tipTxt) {  
	dlgHTML = "<DIV id='tipCntnr'>";
	if(tipTtle)  {
	  dlgHTML = dlgHTML + "<SPAN id='tipHdr'>" + tipTtle + "</SPAN>";
  }
	if(tipTtle && tipTxt)  {
	  dlgHTML = dlgHTML + "<BR/><BR/>";
  }	
	if(tipTxt)  {
	  dlgHTML = dlgHTML + "<SPAN id='tipCntnt'>" + tipTxt + "</SPAN>";
  }
	dlgHTML = dlgHTML + "</DIV>";
	return dlgHTML;
}

function posTip() {
	var Xpos = 0;
	var Ypos = 0;
	var e = window.event;
	if (e.pageX || e.pageY) 	{
		Xpos = e.pageX;
		Ypos = e.pageY;
	}
	else if (e.clientX || e.clientY) 	{
		Xpos = e.clientX + document.body.scrollLeft	+ document.documentElement.scrollLeft;
		Ypos = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
	}	
	
	document.getElementById('tipBox').style.top = Ypos + 15;	
	document.getElementById('tipBox').style.left = Xpos + 15;
}

function showTip(tipTtle,tipTxt) {
	var newHTML = drawDlg(tipTtle,tipTxt);
	var greyBx = document.createElement('div');
	greyBx.setAttribute('id', 'tipBox');
	greyBx.innerHTML = newHTML;
	whereTo = document.getElementById('rootContainer');
	document.body.insertBefore(greyBx, whereTo);
	document.getElementById('tipBox').style.position = "absolute";
	posTip();
}

function hideTip() {
	if(document.getElementById('tipBox')) {
	  document.body.removeChild(document.getElementById('tipBox'));
	}
}