2013-07-14 2 views
1

jquery 애니메이션을 설정하면 오브젝트가 페이드 인하여 화면 상단에서 아래로 내려간 다음 이동하고 페이드 아웃해야합니다. 현재는 페이드 인하 고 애니메이션을 내리고 일시 정지 한 다음 애니메이션을 완성합니다. 잠시 멈춰야겠다.하지만 어떻게해야할지 모르겠다. 지금 애니메이션을 콜백으로 설정했습니다. 당신은 여기에서 볼 수있다 :이에서 얻을 수있는 모든 도움을jquery 애니메이션 간의 일시 중지 방지

http://jsbin.com/uniyix/12/edit

감사합니다!

+0

jquery의 기본 'easing'은'swing'입니다. 따라서 실제로 멈춤이 아니라 천천히 진행됩니다. 따라서 다른 '완화'를 선택해야합니다. –

+0

t.niese가 정확합니다 (최소한 jQuery 애니메이션의 경우) : http://jsbin.com/uniyix/37/edit. 또는 CSS 없이도 동일한 결과를 얻으려면 CSS3 전환 (http://www.css3.info/preview/css3-transitions/) 및 키 프레임 애니메이션을 살펴볼 수 있습니다. –

답변

0

정보는 여기 Jquery animate() Documentation에서 찾을 수 있습니다. 보다 구체적으로, 완화 매개 변수입니다.

두 가지 종류의 여유가 있습니다 : 하나는 스윙입니다 (기본값이며 애니메이션의 시작 부분에서 속도가 증가하고 끝에 느려지 며 "일시 중지"처럼 보임) 여러 개의 애니메이션이 설정된 경우) 다른 하나는 선형 인입니다.

선형 속도는 전체적으로 일정하기 때문에 속도 저하가 없습니다. 속도 매개 변수 직후에 여유 매개 변수를 정의 할 수 있습니다.

그래서이 :

$('#example').animate({ 
    'marginLeft' : "+=30", 
    }, 3000, function() { 
}); 

이 될 것입니다 : 요소가 전체 애니메이션에 걸쳐 일정한 속도에있을 것 같은

$('#example').animate({ 
    'marginLeft' : "+=30", 
    }, 3000, "linear", function() { 
}); 

이 작업은 일시 정지를 제거해야한다.

관련 문제