Форум программистов [Powered by Invision Power Board]

Код

<HTML>
<HEAD>
<script language="javascript">
function Panoram(containerId, width, height, panoram_step){
    var obj = this;
    var div1 = null;
    var img1 = new Image();
    var step = panoram_step;
    var direct = 0;

    var container = document.getElementById(containerId);
    if (container == null){
         alert('Неверно указан контейнер!');
         return null;
    }

    var interval_id = 0;

    var panoram_width = width;
    var panoram_height = height;

    var speed = 0;

    doMove = function(){
       div1.style.left = parseInt(div1.style.left) + direct * step;
       interval_id = setTimeout("doMove()", 100 - speed);

    }
        
    setSpeed = function(){


        ob = container;
        var x=0, y=0;
        while(ob) {
          x+=ob.offsetLeft;
          y+=ob.offsetTop;
          ob=ob.offsetParent;
        }

        delta = panoram_width/2 - (event.screenX - x);
        if (delta > 0){direct = -1;}
        else {direct = 1;}

        speed = Math.round(Math.abs(200*(delta/panoram_width)));
    }

    killInterval = function(){ clearTimeout(interval_id); }

    setImage = function(imgName){
      img1.src = imgName;
    }

    init = function(){
      if (!img1.complete){
         setTimeout(init, 1000);
         return;
      }
      div1 = document.createElement('span');
      if (img1.height != panoram_height){
         k = panoram_height / img1.height;
         img1.height = img1.height * k;
         img1.width = img1.width * k;
    }
    
    container.style.width = panoram_width;
    container.style.height = panoram_height;
    container.style.overflow = 'hidden';
    
    div1.style.position = 'relative';
    div1.style.visibility = 'visible';
    div1.style.display = 'inline';

    div1.style.left = (parseInt(container.style.width) - img1.width) / 2;

    speed = 0;


    div1.appendChild(img1);

    container.appendChild(div1);

    container.onmousemove = setSpeed;
    container.onmouseenter = doMove;
    container.onmouseout = killInterval;
  }

}

function onBodyLoad(){
    var p = new Panoram('testId', 400, 197, 1);
    setImage('lyuteranskaya.jpg');
    init();
}
</SCRIPT>

</HEAD>
<BODY onload="onBodyLoad();">
<DIV style="border:solid black 1pt;" name="test" id="testId"></DIV>
</BODY>
</HTML>