var zzz;

function zoom_start(event,id,gr_id,img)
{
   var grafika_zoom = img;//adres grafiki powiekszonej
   var grafa = document.getElementById(gr_id);//podstawowa grafika
   var szerokosc = grafa.width;//szerokosc grafiki podstawowej
       var wysokosc = grafa.height;// wysokosc grafiki podstawowej
   var x,y;//wspolrzedne kursora na danej grafice
   var lewo, gora;//wspolrzedne dla elementu lupa/podglad

   if(!event.pageX)//dla IE
   {
      x = event.clientX+document.body.scrollLeft+1.;
      y = event.clientY+document.body.scrollTop+1;
      lewo = event.clientX+document.body.scrollLeft;
      gora = event.clientY+document.body.scrollTop;
   }
   else
   {
      x = event.pageX;
      y = event.pageY;
      lewo = x;
      gora = y;
   }

   x = x-grafa.offsetLeft-23;
   y = y-grafa.offsetTop-23;

   var lupa = id.getElementsByTagName('span')[0];//ustawienia dla elementu lupa
      lupa.style.display = "inline";
      lupa.style.left = lewo-24+"px";
      lupa.style.top = gora-24+"px";
  
   var podglad = id.getElementsByTagName('span')[1];//ustawienia dla elementu podglad
           podglad.style.display = "inline";
           podglad.style.left = 0;
           podglad.style.top = 0;
      
   var pic=new Image(szerokosc*4,wysokosc*4);//ladowanie powiekszonego obrazka
      pic.src= grafika_zoom;
  
   if(!pic.complete)//jezeli powiekszona grafika jest jeszcze niezaladowana
   {
      window.clearTimeout(zzz);
      zoom_ladowanie(pic,id,grafika_zoom,szerokosc,wysokosc,y,x);
   }
   else
      podglad.innerHTML = '<img src="'+grafika_zoom+'" style="width:'+szerokosc*3+'px;height:'+wysokosc*3+'px;position:relative;top:-'+((y*3)+58)+'px;left:-'+((x*3)+58)+'px;margin:58px 0 0 58px;">';


   if((x+23)<0 || (y+23)<0 || (x+23)>szerokosc || (y+23)>wysokosc)//przekroczenie kursorem granic obrazka podstawowego
   zoom_stop();
}

function zoom_ladowanie(pic,id,grafika_zoom,szerokosc,wysokosc,y,x)
{
   if(!pic.complete)
   {
           id.getElementsByTagName('span')[1].innerHTML = "<p style=\"margin:10px;\">Ladowanie ...</p>";//info wyswietlane podczas ladowania powiekszenia
      zzz = window.setTimeout(function() {zoom_ladowanie(pic,id,grafika_zoom,szerokosc,wysokosc,y,x);},10);
        }
        else
      id.getElementsByTagName('span')[1].innerHTML = '<img src="'+grafika_zoom+'" style="width:'+szerokosc*3+'px;height:'+wysokosc*3+'px;position:relative;top:-'+((y*3)+58)+'px;left:-'+((x*3)+58)+'px;margin:58px 0 0 58px;">';
}

function zoom_stop()
{
        var elementy = getElementsByClass('zoom');//wyszukiwanie elementow z class=zoom
        for (var i=0;i<elementy.length;i++)
        {
            elementy[i].getElementsByTagName('span')[0].style.display = "none";
            elementy[i].getElementsByTagName('span')[1].style.display = "none";
        }
}

function getElementsByClass(searchClass,node,tag)
{
        var classElements = new Array();
        if (node == null)
            node = document.getElementsByTagName("body")[0];
        if (tag == null)
            tag = 'div';
        var els = node.getElementsByTagName(tag);
        var elsLen = els.length;
        var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
        var j = 0;
        for (i = 0; i < elsLen; i++) {
            if (pattern.test(els[i].className) ) {
                classElements[j] = els[i];
                j++;
            }
        }
        return classElements;
}