Scroll To Specific Section/Position/Point Within The Document – VanillaSmoothie.js

Preview:

Description:

A vanilla JavaScript smooth scroll library to smoothly scroll the webpage (or a certain container) to a specific anchor link or position/point within the document.

How to use it:

Install and Import the VanillaSmoothie.js.

# NPM
$ npm install vanilla-smoothie --save

import vanillaSmoothie from 'vanilla-smoothie';

Or directly insert the compiled version of the VanillaSmoothie.js library in the document.

<script src="vanilla-smoothie.min.js"></script>

Scroll the webpage to a specific section or a specific point. Possible parameters:

• target: target element: selector or offset
• option: options (optional)
• callback: trigger an event when the scroll is finished (optional)

vanillaSmoothie.scrollTo(target, option, callback);

Scroll the webpage to the top. Ideal for back to top button.

vanillaSmoothie.scrollTop(option, callback);

Scroll the webpage to the bottom. Ideal for back to top button.

vanillaSmoothie.scrollBottom(option, callback);

Optional settings.

{
  // element to scroll
  element: window,
  // duration of animation
  duration: 500,
  // adjust the scroll position
  adjust: 0,
  // easing name
  easing: 'linear'
}

Changelog:

v2.2.2 (10/11/2019)

• Updated

v2.0.0 (09/02/2019)

• Replace to TypeScript.
• Change method parameters.
• Add adjust option.
• Add Travis CI and pre-commit lint.

05/26/2019

• v1.2.4: updated

05/16/2019

• v1.2.3: updated

04/27/2019

• v1.2.2: update easing option