var xOffset=6
var yOffset=5    

var affiche = false;
var w3c=document.getElementById && !document.all;
var ie=document.all;

if (ie||w3c) {
  var photo
}

function ietruebody(){ 
  return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function deplacer(e) {
  if(affiche){
    var curX = (w3c) ? e.pageX : event.x + ietruebody().scrollLeft;
    var curY = (w3c) ? e.pageY : event.y + ietruebody().scrollTop;

    var winwidth = ie && !window.opera ? ietruebody().clientWidth : window.innerWidth - 20;
    var winheight = ie && !window.opera ? ietruebody().clientHeight : window.innerHeight - 20;

    var rightedge = ie && !window.opera ? winwidth - event.clientX - xOffset : winwidth - e.clientX - xOffset;
    var bottomedge = ie && !window.opera ? winheight - event.clientY - yOffset : winheight - e.clientY - yOffset;

    var leftedge = (xOffset < 0) ? xOffset*(-1) : -1000

    
    if(photo.offsetWidth > winwidth / 3){
      photo.style.width = winwidth / 3
    }

    
    if(rightedge < photo.offsetWidth){
      
      photo.style.left = curX - photo.offsetWidth + "px"
    } else {
      if(curX < leftedge){
        photo.style.left = "5px"
      } else{
        photo.style.left = curX + xOffset + "px"
      }
    }

    if(bottomedge < photo.offsetHeight){
      photo.style.top = curY - photo.offsetHeight - yOffset + "px"
    } else {
      photo.style.top = curY + yOffset + "px"
    }
  }
}
function montre(text) {
  if (w3c||ie){
    photo = document.all ? document.all["cadre"] : document.getElementById ? document.getElementById("cadre") : ""
    photo.innerHTML = text;
    photo.style.visibility = "visible";
    affiche = true;
  }
}
function cache() {
  if (w3c||ie){
    affiche = false
    photo.style.visibility="hidden"
    photo.style.top = '-1000px'
    photo.style.backgroundColor = ''
    photo.style.width = ''
  }
}

document.onmousemove = deplacer;