SVG .end event not working?

问题

I'm trying to learn and play with some basic SVG animations. I was going through a tutorial/guide on CSS-Tricks, and noticed that the .end event doesn't work in Chrome and Safari. What gives? Is this not supported or a bug?? Seems silly for a simple thing like. Or maybe it's a bug with Codepen?

Example Codepen - http://codepen.io/jaminroe/pen/xGQvEE/?editors=110

Thanks

回答1:

It's not a good idea to use - in an id if you're going to use it with animate as it's assumed that you're starting a time offset such as id-5s

You can do if you really must but you have to escape them i.e.

begin="circ\-anim.end"

回答2:

I didn't know this yet, but apparently you can't use hyphens in the ID of an SVG <animate> element. facepalm

I changed my ID from circ-anim to circAnim.

来源：https://stackoverflow.com/questions/31732492/svg-end-event-not-working