I am designing a website as part of my dissertation project for Uni (Creative Sound and Media)
I am flipping between Muse and Animate to try and animate a stroke that I made in illustrator, as for some unknown reason, Adobe thought it wasn't necessary to include a pen tool in Animate or Muse. So I made a stroke vector in illustrator. Because the stroke is bent, animating it using the Clip properties is very difficult.
I have tried so hard to understand the Java and css elements to do it via the way of code. But after days and hours of trying to understand and implement code to animate the lines, I have not got anywhere. What's more, using code to draw the line in is one thing, to draw it in and out using scrolling animation, which I want, is completely another.
Below is a screen shot to give you an idea what I am trying to achieve. A DRAFT concept of the final idea that I made in After Effects is found here Parallax Website draft idea on Vimeo.
It doesn't include a pen tool because it is designed to work directly with html5 elements.
It does however include a pen tool to create a motion path - which may be beneficial to you.
The easiest way to get it to work on scroll and create a parallax effect might be to implement: