Search code examples
svgsvg-animate

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

Solution

  • 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"