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

// show and hide
function tt_show(i) {
  $("tooltips").innerHTML = i;
  $("tooltips").style.display = "block";
}
function tt_hide() {
  $("tooltips").style.display = "none";
}

// detect the mouse position and move the text
document.onmousemove = tt_mouse_move;

function tt_mouse_move(e) {

  var posx = 0;
  var posy = 0;

  if (e == null) { e = window.event; }

  if (e.pageX || e.pageY) {
    posx = e.pageX;
    posy = e.pageY;
  }
  else if (e.clientX || e.clientY) {

    if (document.documentElement.scrollTop) {
      posx = e.clientX+document.documentElement.scrollLeft;
      posy = e.clientY+document.documentElement.scrollTop;
    }
    else {
      posx = e.clientX+document.body.scrollLeft;
      posy = e.clientY+document.body.scrollTop;
    }

  }

  $("tooltips").style.top = (posy+15)+"px";
  $("tooltips").style.left = (posx+15)+"px";

}