var size_small = 200;
var size_big = 2000;

var dragging = 0;
var maxLeft = 0;
var maxTop = 0;
var halfWidth = 0;
var halfHeight = 0;
var objImg;
var objPointer;
var objThumbobj;
var objPg;

function InitMap() {
  objImg      = document.getElementById('imgMap');
  objPointer  = document.getElementById('divPointer');
  objThumbobj = document.getElementById('divThumb');
  objPg       = document.getElementById('divPgHolder');

  maxLeft = objImg.offsetWidth  - objPointer.offsetWidth;
  maxTop  = objImg.offsetHeight - objPointer.offsetHeight;
  halfWidth  = parseInt(parseInt(objPointer.offsetWidth)/2);
  halfHeight = parseInt(parseInt(objPointer.offsetHeight)/2);

  SetPointer(150,60);
}
function SetPointer(x,y) {
  var curLeft = x - halfWidth;
  var curTop  = y - halfHeight;
  if (curLeft > maxLeft) curLeft = maxLeft;
  if (curTop  > maxTop ) curTop  = maxTop;
  if (curLeft < 0) curLeft = 0;
  if (curTop  < 0) curTop  = 0;
  objPointer.style.left = curLeft;
  objPointer.style.top  = curTop;

  objPg.style.left = -1 * (curLeft / size_small) * size_big;
  objPg.style.top =  -1 * (curTop / size_small) * size_big;

  objPointer.style.visibility = 'visible';
}
function SetPos() {
  var x = event.clientX - objThumbobj.offsetLeft;
  var y = event.clientY - objThumbobj.offsetTop;
  SetPointer( x, y );
}
function MouseMovePointer() {
  if (dragging) SetPos();
}