2012-01-24 2 views
0

애니메이션을 기다리는 공식적인 방법은 애니메이션 함수에 전송 된 콜백입니다. 애니메이션 호출 외부에 대기 루프 (watchdog 포함)를 수행하여 애니메이션 대기열을 어떻게 든 질의 할 수 있습니까?jQuery는 애니메이션 큐를 쿼리하여 애니메이션을 기다리고 있습니까?

예 (및 구체적인 문제)

우리는 jQuery lightbox 0.5을 사용하고 닫기 버튼을 이동하고 약간의 정보 내용을 추가했습니다. 이 상자는 Internet Explorer 8을 제외하고는 올바르게 렌더링됩니다. IE8에서는 페이지 크기가 조정되거나 마우스 오버가 발생할 때까지 아래쪽 항목이 너무 멀리 위로 배치됩니다.

제대로 성공하려면 IE가 애니메이션 사이에 대기해야합니다. 코드의 흐름을 변경하지 않고이 문제를 해결하고 싶습니다. . 가능한가?

이 jQuery를 라이트 박스에서이다 : 나는 이런 식으로 변경하면

/** 
* Show the prepared image 
* 
*/ 
function _show_image() { 
    $('#lightbox-loading').hide(); 
    $('#lightbox-image').fadeIn(function() { 
     _show_image_data(); 
     _set_navigation(); 
    }); 
    _preload_neighbor_images(); 
}; 
/** 
* Show the image information 
* 
*/ 
function _show_image_data() { 
    $('#lightbox-container-image-data-box').slideDown('fast'); 

, 그것은 IE8에서 잘 작동합니다

/** 
* Show the prepared image 
* 
*/ 
function _show_image() { 
    $('#lightbox-loading').hide(); 
    $('#lightbox-image').fadeIn(function() { 
     _show_image_data(); 
    }); 
    _preload_neighbor_images(); 
}; 
/** 
* Show the image information 
* 
*/ 
function _show_image_data() { 
    $('#lightbox-container-image-data-box').slideDown('fast', function() { 
     _set_navigation(); 
    }); 

나는 특정 요소에 대한 애니메이션 큐 기다릴 수 있습니까?

의사 코드 :

/** 
* Show the prepared image 
* 
*/ 
function _show_image() { 
    $('#lightbox-loading').hide(); 
    $('#lightbox-image').fadeIn(function() { 
     _show_image_data(); 
     var timeout = 500; 
     $('#lightbox-container-image-data-box').waitForAnimation(timeout); 
     _set_navigation(); 
    }); 
    _preload_neighbor_images(); 
}; 
/** 
* Show the image information 
* 
*/ 
function _show_image_data() { 
    $('#lightbox-container-image-data-box').slideDown('fast'); 
+0

[jQuery.fn.queue] (http://api.jquery.com/queue/)를보십시오. – Avaq

답변

2

당신은 queue 자신의 효과 (FX) 큐에 기능, 심지어 delay 그들이 당신이 원하는 할 수 있습니다. 라이트 박스와 동일한 요소에 적용하고 있는지 확인하십시오.

$('#lightbox-image').delay(1000).queue(function(next) { 
    // your code here 

    if (next) next(); 
}); 
+0

완벽하게 작동합니다! 감사! :) –

관련 문제