如何訂購jQuery的順序

影響我有這樣的代碼片段：如何訂購jQuery的順序

$("a#list-mode").click(function() { 
    $("#list-fix-pos").removeClass('col-lg-3', 1250, "easeInOutQuart"); 
    $(this).hide("fade", 1250, true); 
    $("a#map-mode").show("fade", 1250, true); 
});

如何訂購的影響，使他們將按順序進行？目前，所有效果都立即過渡。

感謝

來源

2013-08-01 alias51

有不同的方式來訂購的動畫你想實現的，你可以使用的setTimeout或$ .delay（） –

可能重複[jQuery的效果事件順序和等到動畫完成]（http://stackoverflow.com/questions/2407592/jquery-event-order-and-waiting-till-animation-complete） –

jQuery的.hide和.show功能允許您指定完成後要執行的功能。語法是

.hide(duration [, easing ] [, complete ])

在你的情況，這會是

$("a#list-mode").click(function() { 
    $("#list-fix-pos").hide(1250, 'easeInOutQuart', function() { 
     $(this).hide(1250, 'fade', function() { 
      $("a#map-mode").show(1250, 'fade'); 
     }); 
    }); 
    $("#list-fix-pos").removeClass('col-lg-3'); 
});

來源

2013-08-01 00:54:14 kba

你有3個選擇

使用完全由回調元素時返回
使用承諾他們有動畫進行
使用.delay()

3日的情況是最簡單的，並承諾保持代碼清潔

$(...).animate(duration1,...)... 
$(...).delay(duration1).animate(duration2,...)...

而只是供參考：

$(...).animate().promise().pipe(...)

或類似

$.when($(...).animate(...).promise()) 
.then(function(){ return $(...).animate(...).promise() }) 
.then(function(){ return $(...).animate(...).promise() }) 
...

這看起來相當不錯，如果你給函數的名稱

function hideButton() { return $(...).animate().promise() } 
function showMenu() { return $(...).animate().promise() } 

$.when(hideButton).then(showMenu)

來源

2013-08-01 00:59:28 vittore

如何訂購jQuery的順序

回答

相關問題