Skip to content

firstandthird/smooth-scroller

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

59 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Smooth-scroller

npm

A tiny, ES6 JavaScript lib to handle smooth scrolling.

Installation

npm install smooth-scroller

Usage

See the full example.

Javascript

import 'smooth-scroller';

HTML

<a href="#foo" data-smooth>Scroll Smoothly</a>
...some content...
<div id="foo"></div>

Events

Custom events are fired on the element:

Event Description
smoothscroll:start Smooth scroll starts
smoothscroll:end Smooth scroll ends

Methods

Smooth-scroller exposes two methods:

init([selector='[data-smooth]'], [offset=0])

Enables smooth-scroller on the elements matched by selector.

Parameters

selector='[data-smooth]' - {String} - Elements that will trigger smooth-scroll call once they're clicked

offset=0 - {Number} - Controls the distance (negative or positive) between the top border of the element and the top border of the window.

scroll(target, hash, [offset=0], [silent=false])

target - {string|Element|NodeList} - Target element to scroll

hash - {string|Element|NodeList} - DOM element ID to scroll

offset=0 - {Number} - Controls the distance (negative or positive) between the top border of the element and the top border of the window.

silent=false - {Boolean} - If enabled, will generate a history.pushState event