css3 的時代，css3--動畫 一切皆有可能；
傳統的js 可以透過回呼函數判斷動畫是否結束；即使是採用CSS技術產生動畫效果，JavaScript仍能捕捉動畫或變換的結束事件；
transitionend事件和animationend事件標準的瀏覽器事件，但在WebKit瀏覽器裡你仍然需要使用webkit前綴，所以，我們不得不根據各種瀏覽器分別檢測事件
var transitions = {
'transition':'transitionend',
'OTransition':'oTransitionEnd',
'MozTransition':'transitionend',
'WebkitTransition':'webkitTransitionEnd'
}
下面附上原始碼：
suface js判斷css動畫是否結束
一旦動畫或變換結束，回呼函數就會觸發。不再需要大型類庫支援。
css3動畫過度慢慢隱藏（transition-duration:3s;）
<script> <br />
(function() {<br />
var e = document.getElementsByClassName('sample')[0];<br />
function whichTransitionEvent(){<br />
var t;<br />
var el = document.createElement('fakeelement');<br />
var transitions = {<br />
'transition':'transitionend',<br />
'OTransition':'oTransitionEnd',<br />
'MozTransition':'transitionend',<br />
'WebkitTransition':'webkitTransitionEnd'<br />
}<br />
for(t in transitions){<br />
if( el.style[t] !== undefined ){<br />
return transitions[t];<br />
}<br />
}<br />
}<br />
var transitionEvent = whichTransitionEvent();<br />
transitionEvent && e.addEventListener(transitionEvent, function() {<br />
alert('css3運動結束！我是回呼函數，沒有使用第三方類別庫！');<br />
});<br />
startFade = function() {<br />
e.className = ' hide';<br />
}<br />
})();<br></script>
以上就是本文所述的關於javascript判斷CSS3動畫結束的方法，希望大家能夠喜歡
