<!DOCTYPE html>
<head>
<title>Box Click Box Move</title>
<style type="text/css">

#info
{
  width: 100px; height: 100px;
  background-color: #ff0000;
  position: absolute;
  top: 0;
  left: 0;
}
</style>
<script>

window.onload=function() {
  document.onclick=processClick;
}

function processClick(evt) {
  evt = evt || window.event;
  var x = 0; var y = 0;
  if (evt.pageX) {
    x = evt.pageX;
    y = evt.pageY;
  } else if (evt.clientX) {
    var offsetX = 0; offsetY = 0;
    if (document.documentElement.scrollLeft) {
       offsetX = document.documentElement.scrollLeft;
       offsetY = document.documentElement.scrollTop;
    } else if (document.body) {
       offsetX = document.body.scrollLeft;
       offsetY = document.body.scrollTop;
    }

    x = evt.clientX + offsetX;
    y = evt.clientY + offsetY;
  }

  var style = "left: " + x + "px; top: " + y + "px";
  var box = document.getElementById("info");
  box.setAttribute("style", style);

  // IE7
  // box.style.left=x + "px";
  // box.style.top=y + "px";
}
</script>
</head>
<body>
<div id="info"></div>
</body>
// Code goes here

/* Styles go here */