2010-07-15 1 views
1
나는 일어나고에서 CSS를하지만,이 방법 실 거예요 작업 등의 작업을 지연 할

. 내가 작업을 지연시킬 수있는 방법에 대한 아이디어.jQuery를 지연 큐

$(function() { 
    $('.btn').click(function() { 
    $('.divOne').animate({"left": "+=400px"}, "fast").delay(800).css("background-color","yellow"); 
    }); 
});  

답변

4

당신은이 같은 (fx) 큐, 기본 애니메이션에 충실하기 위해 .queue()를 사용할 수 있습니다

$('.btn').click(function() { 
    $('.divOne').animate({"left":"+=400px"}, "fast").delay(800).queue(function(n) { 
    $(this).css("background-color","yellow"); 
    n(); //call next function in the queue, needed if you animate later! 
    }); 
}); 

You can test it here, 모든 일이는 n.queue(function(n))를 사용하여 fx 큐에 스틱입니다 대기열에있는 다음 기능입니다, 그래서 당신 이 작업을 수행하고, 그냥 실행되지 않을 것입니다 후 어떤 애니메이션을 추가하지 않은 경우 우리는 t 있기 때문에, 예를 들어, 호출하고 그는 다음 함수 또는 .dequeue()이 호출되지 않습니다.

+0

'n'은 실제로 qeue의 다음 함수가 아니며,'dequeue()'를 호출하는 익명의 함수로, 큐의 다음 함수를 효과적으로 호출합니다 .... – gnarf

+0

@gnarf - 의미론 이 메소드 체인을 수행 할 때 난 큐 배열 자체가되지 않을 경우,이 큐의 다른 모든 기능에 대한 * 다음 기능 *이며, 익명 함수 * 효과적으로, 큐에 * 다음 것을, 가정 :) –

+0

touchset;) 나는 양보한다. – gnarf

1

은 아마 애니메이션에 콜백 함수를 사용합니다. 애니메이션이 완료되면 setTimeout()

$(function() { 
    $('.btn').click(function() { 
    $('.divOne').animate({"left": "+=400px"},"fast", function() { 
     var $elem = $(this); 
     setTimeout(function() { 
      $elem.css('background-color','yellow'); 
     }, 800); 
    }) 
}); 

구문 상 완벽하지 않을 수 있습니다.

+0

setTimeout에 문자열을 전달하지 마라! 대신 다음과 같아야합니다'에서는 setTimeout (함수() {$ ('div.one.') CSS ('배경 색', '노란색').}, 800); '내가 당신의 대답을 업데이트 –

+0

사용하지 setTimeout의 악의적 인'eval'ed 문자열 인수와 콜백에 애니메이션 요소를 저장하게하여 jQuery DOM 선택기를 통해 다시 사냥 할 필요가 없습니다. – gnarf