Javascript effects: trigger animations & transitions on SVGs




Triggering animations and transitions on SVG graphics using Javascript.

Code & tutorials: http://learn-the-web.algonquindesign.ca/topics/javascript-effects/

Original source


5 responses to “Javascript effects: trigger animations & transitions on SVGs”

  1. Nice video, but I was looking for some way to trigger an <animation> tag in the svg, to morph it, using the begin property. I guess I can just add the tag with javascript and get rid of it once I'm done, but I feel like there's a more direct way…

  2. Professor, this is a good demonstration on how you can animate SVG using jQuery. I just wanted to share with you that just incase if haven't noticed in Adobe Illustrator CC, there's an option called SVG Interactivity and Variables for specifically for SVG animation. So, if you open Adobe Illustrator CC then go to Window > SVG Interactivity from the window menu.

    I don't know much about it but thought that you might enlighten us with this set of awesome tools and it's options available for us to take the SVG animation and interactivity to the next level.

    Thank You so much for all of your great Video Tutorials!

Leave a Reply