2012-06-23 2 views
0

내가이 깔끔한 jQuery slider가는이 왼쪽, 나는 이미지가 천천히가 페이드로 오른쪽에서 왼쪽으로 슬라이드하고 싶지으로 이동 만들기 배경 이미지 페이드는

을 내가 이것을 볼 수있는 jQuery를보고합니다. :

switch(effect){ 
    case 'fade': 
    $new.css({'z-index':zPos,'top':'0','left':'0','display':'none'}).fadeIn(speed); 

이제 다음 이미지가 나타날 때까지 이미지가 왼쪽으로 계속 슬라이드하여 사라지도록하고 싶습니다.

$new.animate({ 
    left: parseInt($new.css('left'),10) == 0 ? 
    -$new.outerWidth() : 
    0 
}); 

페이드에 추가하면 슬라이드의 지속 시간과 캐 러셀의 지속 시간을 더한 후에 만 ​​이미지가 슬라이드됩니다. 즉 이미지 전환 직전에 왼쪽으로 슬라이드합니다. 또한 전환 속도가 매우 느려야하므로 속도를 제어하고 싶습니다.

이미지를 논스톱 유체 동작처럼 계속 슬라이드하게 만들려면 어떻게해야합니까?

답변

0

애니메이션 효과에는 GreenSock (GSAP) v12을 사용하는 것이 좋습니다. timelineMax 기능을 사용하여 여러 애니메이션을 대기열에 추가하고 차례로 재생하지 않고 동시에 재생할 수 있습니다. 그것은 jquery의 애니메이션과 페이드가 더 유연한 방법입니다. 그것은 당신이 완벽하게 제어 할 수 있고 jquery로 잘 작동합니다.

+0

jQuery 슬라이더를 제외하고 이것은 위대합니다. GS Tweening으로 애니메이션을 시작한 다음 슬라이더에서 다음 jQuery 명령을 수행하는 방법을 알고 있습니까? – AlxVallejo