 var cursor_x;
 var cursor_y;

 var displayed = 0;
 var box_id = 'reference_box';

 
 // event listener
 /*
if (window.captureEvents) {
  window.captureEvents(Event.mousemove);
  window.onmousemove = displayCoords;
 } 
 else {
  document.onmousemove = displayCoords;
 }
*/
 if(window.addEventListener){ // Mozilla, Netscape, Firefox
	window.addEventListener('mousemove', displayCoords, false);
} else { // IE
   document.onmousemove = displayCoords;
}
 
 // functions
 
 function displayCoords(e) {
   
  if (window.event) { 
  
  cursor_x = event.clientX + document.body.scrollLeft; cursor_y = event.clientY + document.body.scrollTop; 
	// add scrolled area
   if (document.documentElement.scrollTop) { cursor_x += document.documentElement.scrollLeft; cursor_y += document.documentElement.scrollTop; }

  } // IE
  else { cursor_x = e.pageX; cursor_y = e.pageY;  }
  
  //window.status= "x: " + cursor_x + " y: " + cursor_y + " scroll: " +  document.documentElement.scrollTop;
  
	if (displayed) {
	
	b = document.getElementById(box_id);
// px for validity
	b.style.left = cursor_x + 'px';
	b.style.top = cursor_y + 'px';
	
	}
  
 }

 //gather data from id div and make BOX visible
function displayBox(id) {

if (!document.getElementById(id)) return;
if (!document.getElementById(box_id)) return;

	src = document.getElementById(id).innerHTML;
	b = document.getElementById(box_id);
	
	b.innerHTML = src;
	b.style.visibility = "visible";

	displayed = true;
	
}

// empty data & hide
function hideBox() {

if (!document.getElementById(box_id)) return;

	b = document.getElementById(box_id);
	b.innerHTML = '';
	b.style.visibility = "hidden";
	displayed = false;
}
