2012-01-24 56 views
0

我知道等待動畫的官方方式是發送給動畫函數的回調函數。是否仍有可能以某種方式查詢動畫隊列,在動畫調用之外執行等待循環(使用watchdog)?jQuery通過查詢動畫隊列等待動畫?

例(和具體問題)

我們使用jQuery lightbox 0.5並陸續關閉按鈕,並添加一些信息內容。 除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相同的元素即可。

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

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

完美的作品!謝謝! :) –