/scroller

Create a self drawing svg line that responds to page scroll

Primary LanguageJavaScript

scroller

This is a very short script to create a self drawing line.

Basic usage:

  • Create an SVG with a path (other elements will not work e.g. polyline).
  • Give the element an id.
  • Add the following javascript.
new Scroller({
  'el': document.getElementById(svgID),
  'startPoint': .5,
  'endPoint': .5
}))

This will create an element where the scrolling starts when the top of the line is in the middle of the page and will finish when the end of the line is in the middle of the page.

Check out my blogpost for more information.