如何使用jQuery 監控CSS3 過渡和動畫的結束
使用不透明度過渡淡出元素時，通常想要完成後從DOM 中刪除該元素。 jQuery 透過允許您指定動畫完成後的刪除來簡化此過程。然而，使用 CSS3 過渡時變得更具挑戰性。
偵測過渡/動畫結束
要透過jQuery 偵測過渡的結束，您可以使用以下方法：
$("#someSelector").bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){ ... });Mozilla 提供了此方法的詳細參考：https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Transitions/Using_CSS_transitions#Detecting_the_start_and_completion_of_a_transition
For動畫，方法類似：
>您可以在bind()方法中指定所有以瀏覽器為前綴的事件字串以確保相容性。$("#someSelector").bind("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd", function(){ ... });要確保事件處理程序僅觸發一次，請使用jQuery 的.one() 方法：
$("#someSelector").one("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function(){ ... });
$("#someSelector").one("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd", function(){ ... });jQuery 的bind() 方法已被棄用；使用on() 代替（從jQuery 1.7 開始）。您也可以在回呼函數上使用 off() 來啟用單次觸發。這是使用on() 和off() 的等效範例：
$("#someSelector")
.on("animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd",
function(e){
// do something here
$(this).off(e);
});[.off() 方法]( https:/ /api.jquery.com/off/)
以上是如何使用 jQuery 監控 CSS3 轉換和動畫的結束？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
