dwigt
dwigt's Achievements
2
Reputation
-
Hi ZachSaucier Thank you for your response and the article by Souidan. I will try to clarify. I need to make a series of banner formats. By using an SVG I can export a bunch of objects and have them positioned without too much difficulty because they are inside an SVG. I like to use SVG's if I can to keep filesize down and not have to worry about sizes and scaling. With this animation I am trying to make it look like snow falling from the sky to the ground. As you said I need the square to behave like a DOM element not in the SVG coordinate space. This way the square will go just barely outside the green square, then I can reset the position and play it over. I actually thought of a way to do it while writing this post.. By scaling the animation equal to the difference between the DOM and the SVG coordinate system, and it is an okay solution. I edited the codepen to show what I mean: https://codepen.io/dwigt/pen/KKKWQZm I am still wondering if there is an easier ways to do such such a manipulation. I am also doing some heavy calculations while the animation is running. I might have to think of a way to do it beforehand.. oh and also read Souidans article. Thanks!
-
I am trying to make a SVG animation. However the SVG viewbox is larger than the container i am using. Is there any way to account for the scaling of the SVG? I think the Codepen is the best example: https://codepen.io/dwigt/pen/KKKWQZm?editors=1111 Is there an easy way to make sure the red square is moved outside the square and not just halfway without changing the viewBox? Come to think of it. I can divide the viewbox with the size of the SVG to get a scale coefficient. Is this the way to do it? or is there a helper method in TweenMax?
-
Hi Mikel Thank you for the warm welome Your example is a perfect example of what I am trying to achieve. Thanks!
-
I am trying to make a few elements fade into each other in a Timeline being repeated 10 times. The problem I am having is making the animation overlap when the timeline ends and a new begins. In the Codepen demo how can I make sure the animation overlaps so the white background is never visible when the square changes color? Thanks.
