冒泡一個CSS動畫事件

Question

所以根據MDN（它是有道理的）AnimationEvent有bubble的論點，但如何將它設置爲true？考慮到事件是從CSS動畫中觸發的。

Answer 1

好吧，事實證明，CSS做泡沫事件，例如：

HTML：

<ul id="ul"> 
    <li> 
     <a id="a">Some text!</a> 
    </li> 
</ul> 

CSS：

a 
{ 
    color: red; 
} 
a:hover 
{ 
    -webkit-animation-duration: 1s; 
    -webkit-animation-name: change-color; 
} 

@-webkit-keyframes change-color { 
    from 
    { 
     color: red; 
    } 

    to 
    { 
     color: blue; 
    } 
} 

JS：

var a = document.getElementById('a'); 
var ul = document.getElementById('ul'); 

a.addEventListener('webkitAnimationEnd', handleEnd); 
ul.addEventListener('webkitAnimationEnd', handleEnd); 

function handleEnd(e) 
{ 
    console.log(e); 
} 

你會看到兩起事件被解僱。我遇到的問題是我使用jQuery的bind()，這綁定到一個特定的選擇器，而不是聽泡泡事件（我認爲）。