jQuery函數不是「水龍頭」功能事件

這裏的內部執行是我寫jQuery函數不是「水龍頭」功能事件

$('#move').bind('tap', function() { 
    $('.page').addClass('slideLeftOut', function() { 
    $('#wrapper').css("height","300"); 
    }); 
});

我的問題是功能，我需要的＃包裝的高度改爲300 addClass以後。

我認爲這是正確的語法，但它不會改變addClass函數後的高度。

有什麼建議嗎？

編輯：

這裏是一個的jsfiddle： http://jsfiddle.net/TSM_mac/A8T9f/

來源

2011-06-05 TaylorMac

正常的jQuery addClass方法並不需要一個回調函數。它不返回，直到操作完成，所以你可以放心地把代碼以下行：

$('#move').bind('tap', function() { 
    $('.page').addClass('slideLeftOut'); 
    $('#wrapper').css("height","300"); 
});

由於您使用jQuery UI，但是，這是一個有點棘手。 The jQuery UI extension to addClass不提供回調參數。

由於UI addClass方法使用animate內部，你可以使用jQuery的1.6 $.Deferred增強，它允許你調用函數時完成的元素上的所有動畫。這是很容易與promise實現：

$('#move').bind('tap', function() { 
    $('.page').addClass('slideLeftOut').promise().done(function() {; 
     $('#wrapper').css("height","300"); 
    }); 
});

參見：

注意，這將只運行在所有個動畫是完整的，不只是addClass之一。

如果您使用瀏覽器的原生動畫容量，我不相信有什麼簡單的方法可以找出動畫完成的時間。您需要在指定的時間段內使用setTimeout來運行代碼。

See jsFiddle：

$('.page').addClass('slideLeftOut'); 

setTimeout(function() { 
    $('#wrapper').css("height","300"); 
}, 500);

來源

2011-06-05 23:13:09 lonesomeday

似乎並沒有解決這個問題：/。我會上傳到jsFiddle – TaylorMac 2011-06-05 23:23:32

真的很酷這個承諾的事情......不知道它。 – 2011-06-05 23:23:40

我已經添加了上面的JSfiddle，我將#wrapper背景設置爲紅色，以便您可以看到它。如果在slideLeftOut動畫期間可以看到紅色背景，而不是在完成後，它應該會成功 – TaylorMac 2011-06-05 23:28:29

會發生什麼事，如果你做到這一點？

$('#move').bind('tap', function() { 
    $('.page').addClass(function() { 
    $('.page').addClass('slideLeftOut'); 
    $('#wrapper').css("height","300"); 
    }); 
});

我看不出這個簽名的方法：addClass('slideLeftOut', function() {

欲瞭解更多信息，看看這裏：http://api.jquery.com/addClass/

來源

2011-06-05 23:14:58

：/它仍然添加類'slideLeftOut'並同時更改#wrapper的高度 – TaylorMac 2011-06-05 23:18:05

jQuery函數不是「水龍頭」功能事件

回答

相關問題