Scroll Animation with ScrollTrigger, DrawSVGPlugin, MotionPathPlugin
Hi guys!
I tried to draw an svg path on scroll with these three plugins: ScrollTrigger, DrawSVGPlugin, MotionPathPlugin.
I did it but I really can't understand why it is drawing in reverse order.
When you scroll down more than 30-35%, you will see a red ball drawing a line, but it should start from the top not from the bottom.
I don't know if the problem is with line, css or any other thing.
Can someone please help me with this. I really don't know how to f
Hey @Varunbht,
To compensate for the 'faster' vertical movement, a logic could be defined that counteracts the position of the SVG.
Here is a simple experiment adapted to certain sectors (a fixed width of the SVG!).
See better with a larger window height.
See the Pen XWdwdeR by mikeK (@mikeK) on CodePen
Happy tweening ...
Mikel
