This jQuery plugin allows for Smooth Scrolling with Anchor Highlighting.
ActiveScroll.js determines which targeted element is closer to the page scroll position and highlights that anchor. It provides a smooth scrolling feature with an onclick event attached to a customised data attribute.
Highlighting will only apply to anchors in the initiated container. However all links with the data attribute will have the scrollTo feature.
npm install active-scroll --save
Make sure you have bower installed.
bower install active-scroll --save
Make sure you have a data attribute that references the id of the element that the page will be scrolled to.
Inititate the plugin on the element that contains all the data bindings.
data (default: scroll)
The data setting looks for the data attribute to define the anchor tags. For compatability with other plugins you can change the bind in the options.
active (default: active)
The active setting determines the class name to attach to the anchor if it highlighted.
So if Introduction was determined to be the active Anchor:
offset (default: 20)
The offset setting determines the offset of the scrollTo position.
animate (default: 1000)
The animate setting determines the ms the scrollTo should take.