SVG Animation - How do I do it?


Hi guys,

… I really want to know how this animation works…
This website has an svg animation with the text and I manage to find some of the script but I am missing a portion of it. So if you guys can help with the scouting…(canary chrome lets you see the source code.

I found this so far I found this…

if you guys can help it be great



Which animation are you referring to? Could you post a photo?



they use the same animation code for all of the text. Basically when you scroll down it animates… so theres a tracker for scroll down…and also there’s something that is breaking down the letters…


Animated SVG example here … for them, it’s just a matter of triggering the animations based on page position.


thanks!!! This is awesome :smile:


Good. Dig into that. There are other ways of doing it of course, but that seems to be a nice clear example with all of the parts there for you (check out Velocity.js for more).