jQuery animate shaky

Question

jQuery를 사용하여 배너 형식 컨테이너에서 이미지를 느리게 팬하는 애니메이션을 만들고 있습니다. 그것은 거의 완벽하게 작동하지만 약간 불안해 보입니다. 나는 그것의 속도를 높이려고 노력했지만 그것을 느리게하지만 여전히 흔들립니다.

처음에는 하드웨어 문제 일 수 있으며 PC는 고해상도 이미지를 패닝 처리 할 수 ​​없다고 생각했습니다. 그러나 나는 그림의 질을 줄이고 줄임으로써 문제가되지 않는다는 것을 확인했다. http://parkland2.wethink.ca

애니메이션 코드 :

jQuery.fn.extend({ 
    letsTravel: function() { 
     var horizontalRange = jQuery(this).width() - jQuery(this).parent().width(); 
     var verticalRange = jQuery(this).height() - jQuery(this).parent().height(); 
     var halfHeight = div(verticalRange,2); 
     //horizontalRange and verticalRange are maximum valid horizontal/vertical offset 
     //all coordinates should be below 0 because start point is 0,0 
     jQuery(this).animate({left: (horizontalRange-120)*(-1), top: halfHeight*(-1)},20000, 'linear', function(){ 
      jQuery(this).animate({left: horizontalRange*(-1), top: verticalRange*(-1)},20000, 'linear', function(){ 
       jQuery(this).animate({left: (horizontalRange/2)*(-1)},10000, 'linear', function(){ 
        jQuery(this).animate({left: 0, top: halfHeight*(-1)},20000, 'linear', function(){ 
         jQuery(this).animate({top: 0},10000, 'linear'); 
        }); 
       }); 
      }); 
     }); 
    }  
}); 

어떤 아이디어

당신은 여기 패닝 이미지를 볼 수 있습니까?

감사합니다.

Answer 1

코드에 실수가있었습니다. 수직 이동이 발생하면 수평 위치가 일정하지 않습니다. 이로 인해 문제가 발생합니다. 적절한 기능을 제공 할 수 있습니까?