Draw a curved line on a webpage as the user scrolls

Question

I was wondering if it's possible to dynamically draw a curved line on a website as the user scrolls. I'm pretty sure it could be done using HTML5 Canvas with the bezierCurveTo() method, but that just draws the whole thing out right away.

This will be used on a parallax website that's using the skrollr library.

Is there a library out there that can make this easy?

Any suggestions?

Answer 1

The creator of skrollr here. That's a really interesting problem you came up with. Did you know skrollr works on embedded SVG?

After 30 minutes of searching (starting point: How to draw a vector path progressively? (Raphael.js)) I came up with the following official skrollr demo:

http://prinzhorn.github.com/skrollr/examples/path.html

Yes, I am excited.