mgn-smooth-scroll ( Don't Need jQuery )

Implement smooth scroll.

• Target browser : IE9+

Install

npm i mgn-smooth-scroll -S

Or Download raw data

↓ download "mgn-smooth-scroll.js"

Import

import mgnSmoothScroll from 'mgn-smooth-scroll';

Constructor

new mgnSmoothScroll(element [, option]);

|Argument|Data type|Default|Descroption| |:-------|:--------|:------|:----------| |element|String|-(Required)|Specify target element.ex) "a"| |option|Object|-|ex)option = {speed: 1000,easing: "easeOutQuint",posFix: 50,ignore: ".btn,blank: true,customAnchor: "?anchor=",}|

|Argument|Data type|Default|Descroption| |:-------|:--------|:------|:----------| |speed|Number|800|Specify scroll speed.| |easing|String|"linear"|Specify easing from one of the following:"linear""easeInCubic""easeOutCubic""easeInOutCubic""easeInQuart""easeOutQuart""easeInOutQuart""easeInQuint""easeOutQuint""easeInOutQuint"| |posFix|Number|0|Specify a minus value for header.| |ignore|String|-|Specify element to be excluded from an event.| |blank|Boolean|false|Anchor link for page transition.| |customAnchor|String|"#/"|Specify effective "?anchor=", "?id=" etc. when blank: true is set.|

Method

|Method|Argument|Descroption| |:-------|:--------|:------| |SmoothScroll( Number )|-|Scroll to the position specified in parameter.| |ScrollEnd = function(){};|-|To be executed after scroll is complete.|

Demo

https://frontend-isobar-jp.github.io/mgn-smooth-scroll/

import mgnSmoothScroll from 'mgn-smooth-scroll';

let scroll = new mgnSmoothScroll(
    "a",
    {
        easing: "easeOutQuint",
        ignore: ".ignore",
        posFix: 60,
        blank: true,
    }
);

scroll.ScrollEnd = function(){
    console.log("ScrollEnd")
};