Hi,
2 days ago I purchased the 'Shockingly Green' package, and thoroughly enjoying it, and I am very excited with the endless possibilities!
I have a question. I've created a graph using SVG and the animation is working, the JS code I used is:
(function($) {
$("#containergraph").load("anims/graphgood.svg", function() {
var tween = TweenMax.staggerTo(".points", 1, {
y: '-=435',
ease: Back.easeOut,
Repeat:-1},
0.1);
});
})( jQuery );
As you can see HERE the graph does appear, but I think I don't use it the right way,
The SVG size is 1300x by 600, and therefore it cuts off the top part of my animation when I use the JS code (y: '-=435').
Every line has the correct height already( you can see my SVG HERE), so I would like to see an animation where it starts at at 'y:0' and completes every stagger animation at 100% height for each line if that makes sense. At this moment I have to hide the SVG with Z-index, and I think thats not the right way to achieve the result I want.
Before I purchased Greensock I used SMIL and added the animated SVG as a 'background-image' in the CSS which did the trick, however the compatibility was very limited.
I added an image with the result I like to achieve.
Many thanks!
,Coen
P.S, I didn't add a Codepen because it is hard to replicate the Wordpress environment on Codepen.
