//Creating the tooltip
var tooltip = document.createElement("div");
tooltip.className = "tooltip";
tooltip.style.display = "none";
tooltip.style.position = "absolute";
document.body.appendChild(tooltip);

//OnMouseMove Function
function tooltip_move(move_event){
  if(document.all){
    tooltip.style.left = (event.clientX + 16 + document.documentElement.scrollLeft) + 'px';
    tooltip.style.top  = (event.clientY + document.documentElement.scrollTop) + 'px';
  }
  else{
    tooltip.style.left = (move_event.clientX + 16 + window.pageXOffset) + 'px';
    tooltip.style.top = (move_event.clientY + window.pageYOffset) + 'px';
  }
}

//Spawn the tooltip
function tooltip_on(content)
{
  tooltip.innerHTML = content;
  tooltip.style.display   = "block";
}

//Hide the tooltip
function tooltip_off()
{
  tooltip.style.display = "none";
}

//Create a tooltip for an HTML element
function tooltip_create(element)
{
  element.content=element.title;
  element.title="";
  element.onmouseover = function(){tooltip_on(this.content)};
  element.onmouseout  = function(){tooltip_off()};
}

//Add tooltip for this element and all it's childs (if they have a title attribute)
function tooltip_add(element)
{
  if(element.title)
    tooltip_create(element);
  element = element.firstChild;
  while(element)
  {
    tooltip_add(element);
    element = element.nextSibling;
  }
}

//Add tooltip to all the element of the page
tooltip_add(document.body);

//Track the mouse movement
document.body.onmousemove = tooltip_move;