var kasten = null;          //der verschiebbare kasten
var source = null;          //der hover-kasten
var width = 0;              //~ bildbreite
var height = 0;             //~ halbe bildhöhe
var y = 0;                  //mauszeigerposition
var x = 0;                  //mauszeigerposition

  function open(Ereignis) {                            //hover:
     var img = document.getElementById("change");      //
     img.src = this.src;                               //ändern der src
     var obj = this;                                   //
     if (!Ereignis) {Ereignis = window.event;}
     if (!Ereignis.pageY) {                            //berechnen der position des kastens
       while (obj.offsetParent) {                      //der das ereignis ausgelöst hat
         x += obj.offsetLeft;
         y += obj.offsetTop;
         obj = obj.offsetParent;
       }
     }
     kasten.style.display = "block";                   //anzeigen des kastens
     width = img.width + 15;                           //berechnen von width
     height = img.height / 2;                          //und height
   }
  

   function move(Ereignis) {                                                                                                  //move:
     if (!Ereignis) {Ereignis = window.event;}
     kasten.style.top = (Ereignis.pageY) ?Ereignis.pageY - height - 60 + "px"  :y + Ereignis.offsetY - height + "px";        //ändern der postion
     kasten.style.left = (Ereignis.pageX) ?Ereignis.pageX - width + "px"  :x + Ereignis.offsetX - width + 10 + "px";
   }

   function close(Ereignis) {            //out:
      kasten.style.display = "none";     //ausbleden
      x = y = 0;
   }

   window.onload = function() {
     source = document.getElementsByName("image-zoom");             //alle bilder mit name="image-zoom"
     kasten = document.getElementById("mouseflag");
     for (var i=0; i<source.length; i++) {                    //für jedes bild
     if (document.addEventListener) {                         //setzen der events
       source[i].addEventListener("mouseover", open, false);  //für alle...
       source[i].addEventListener("mousemove", move, false);  //...
       source[i].addEventListener("mouseout", close, false);  //..guten browser
     } else {
       source[i].onmouseover = open;            //und die bösen :/
       source[i].onmousemove = move;            //...
       source[i].onmouseout = close;            //...
     }
    }
   }