지연시 지연 페이딩

나는 꽤 좋은 것을 구식으로 만들었습니다. 곧 프로젝트에서 사용하고 싶었습니다.지연시 지연 페이딩

그것은 부하에 애니메이션 불투명도, 또는 당신이 페이드를 호출 할 수 있습니다.

당신이 함께 일부 요소를 연결할 수 있는지 궁금는 (예. 3) 그래서 element2 만 완료되면 element1 시작하고 element3 때 어떤 . 2는?

element2에 지연을 정의하고 지연을 element3에 곱해야합니까? 당신이 div의이 있다면

2010-06-28 curly_brackets

일반적으로 [queuing] (http://api.jquery.com/queue/)을 사용하여 수행됩니다. – zzzzBov

@zzzzBov 대기열을 사용하여 어떻게 수행하는지 관심이 있습니다. 이점이 있다면 새로운 대답으로 게시 할 수 있습니다. –

@PhilippM, 너무 자세하게 설명하지 않고 요소에 대기열을 설정할 수 있습니다 (일반적으로 여러 요소를 대기열에 넣을 때 공통 부모를 선택 함). 그리고 환상적인 루핑을하지 않아도 상호 작용 순서가 올바르게 연결됩니다. 또는 타이밍 계산] (http://jsfiddle.net/w4xZg/). – zzzzBov

이 class="faded" 말,이 같은 행의 부하에 각 각 퇴색 수 :

$(".faded").each(function(i) { 
    $(this).delay(i * 400).fadeIn(); 
});

You can view a demo of this effect here, 또는 a slower version here을.

$(".faded").hide()

또는 CSS에서 할 : :이 400 당신은 하나 .hide()를 사용할 수있는 일반 .fadeIn() 속도 :

의 기간은 다음과 같이 페이지로드에 그들을 숨길, 400ms 일입니다

.faded { display: none; }

출처

2010-06-28 14:43:43

정말 고마워요. 그게 내가 찾고 있던 바로 그거야! :-) –

이 element2가에서 element1의 완료 콜백시에 시작에 당신은 fadeIn을 할 수 :

element1.fadeIn(500, function() { 
     element2.fadeIn(500, function() { 
      etc...

출처

2010-06-28 14:45:29

이 기능은 몇 가지 기능을 제공하지만 3 가지 이상의 기능을 제공하면 정말 이상하지 않습니다. :) –

-1

이러한 유형의 애니메이션이 성공 콜백의 방식에 어떤 영향을 미치지 않는다고 생각하기 때문에 요소가 얼마나 오래 변색 될지 알고 있다면 setTimeout()과 같은 것을 사용하여 적절한 시간이 지났습니다.

편집 : 수정되었습니다.

출처

2010-06-28 14:45:43 andyortlieb

지연시 지연 페이딩

답변

관련 문제