/*
var imgPath = "../../../images/programs/jingbao/";
var imgArray = new Array(
                      "pic1_clsRm_1.jpg",
                      "pic2_clsRm_1.jpg",
                      "pic3_clsRm_1.jpg",
                      "pic4_active_learn_1.jpg",
                      "pic5_active_learn_1.jpg",
                      "pic6_active_learn_1.jpg",
                      "pic7_outdoor_1.jpg",
                      "pic8_outdoor_1.jpg",
                      "pic9_outdoor_1.jpg",
                      "pic10_specl_occasn_1.jpg",
                      "pic11_specl_occasn_1.jpg",
                      "pic12_specl_occasn_1.jpg"
                    );
var tagName = "divImgPnl";
*/
//start here
var isIE = window.navigator.userAgent.indexOf("MSIE") != -1;
var isFirefox = window.navigator.userAgent.indexOf("Firefox") != -1;
var isSafari = window.navigator.userAgent.indexOf("Safari") != -1;

var imgs = new Array();
var timeout1, timeout2;
var imgShow = false;
var divTag;

window.onload = function() {
  if (typeof (tagName) == "string") {
    for (var i = 0; i < imgArray.length; i++) {
      imgs[i] = new Image();
      imgs[i].src = imgPath + imgArray[i];
    }
    divTag = document.getElementById(tagName);
    document.onmousemove = MouthTracker;
  }
}

function ShowImg(e, img) {
  if (typeof (divTag) != "object") {
    return;
  }
  if (timeout1) clearTimeout(timeout1); 
  if (timeout2) clearTimeout(timeout2);
  imgShow = true;
  divTag.innerHTML = "<img class='imgShow' src='" + imgs[img].src + "' />";
  DisplayImg(e);
}

function MouthTracker(e){
  if (imgShow) DisplayImg(e);
}

function DisplayImg(e) {
  var ele = document.documentElement;
  var X = (isIE) ? window.event.clientX + document.documentElement.scrollLeft : e.pageX;
  var Y = (isIE) ? window.event.clientY + document.documentElement.scrollTop : e.pageY;
  var divW = (isIE) ? divTag.clientWidth : divTag.offsetWidth;
  var divH = (isIE) ? divTag.clientHeight : divTag.offsetHeight;
  var winW = (isIE) ? document.documentElement.clientWidth + document.documentElement.scrollLeft : window.innerWidth - 20 + window.pageXOffset;
  var winH = (isIE) ? document.documentElement.clientHeight + document.documentElement.scrollTop : window.innerHeight - 20 + window.pageYOffset;
  
  if ((X + 20 + divW) >= winW)
    divTag.style.left = X - (divW + 12) + "px";
  else divTag.style.left = X + 12 + "px";
  if ((Y + 12 + divH) > winH)
    divTag.style.top = winH - (divH + 12) + "px";
  else divTag.style.top = Y + 12 + "px";
  timeout1 = setTimeout("divTag.style.visibility = 'visible';", 200);
}

function HideImg() {
  if (typeof (divTag) != "object") {
    return;
  }
  timeout2 = setTimeout("divTag.style.visibility = 'hidden';", 200);
  imgShow = false;
}