slick-scroll

Demos

Demos

Credit:

@shunryu111 http://stackoverflow.com/users/2630316/shunryu111

Based on:

http://stackoverflow.com/a/26798337/5068410

install

npm install slick-scroll --save

usage

import Scroller from 'slick-scroll';
// OR
const Scroller = require('slick-scroll');
 
// window
const windowScroller = new Scroller({
    speed: 1000
})
 
// Container
const container = document.getElementById('rolling');
 
const containerScroller = new Scroller({
    element: container,
    speed: 1000
})
 
myScroller.to(500).scroll()
myScroller.to(500).setSpeed(700).scroll()
myScroller.to(500).setEasing('easeOutSine').scroll();
myScroller.to(500).setSpeed(700).setEasing('easeInOutSine').scroll();
 
// Element in the DOM
myScroller.to(element).scroll()
myScroller.to(element).speed(700).scroll()
myScroller.to(element).easing('easeInOutQuint').scroll();
myScroller.to(element).speed(700).easing('easeInOutQuint').scroll();
 
// Save the scroller and use whenever you need
const scrollToTop = myScroller.to(0).speed(700).easing('easeInOutQuint');
scrollToTop.scroll()
 
const menu = document.getElementById('menu');
const scrollToMenu = myScroller.to(menu).speed(700).easing('easeOutSine');
scrollToMenu.scroll()

Options : object

Kind: global typedef Properties

Name	Type	Default
element	Element	window
speed	number	500
easing	string	"'easeOutSine'"

Scroller

• Scroller
  • instance
    • .setSpeed(speed) ⇒ this
    • .setEasing(easing) ⇒ this
    • .to(to) ⇒ this
    • .calcTime()
    • .getNodeTop(node) ⇒ number
    • .scroll([cb])
  • static
    • .Scroller
      • new Scroller(options)

scroller.setSpeed(speed) ⇒ this

Sets the scroll speed

Kind: instance method of Scroller

Param	Type
speed	number

scroller.setEasing(easing) ⇒ this

Sets the scroll easing function

Kind: instance method of Scroller

Param	Type
easing	string

scroller.to(to) ⇒ this

Sets the scroll to

Kind: instance method of Scroller

Param	Type
to	Element | number

scroller.scroll([onSuccess], [onFailure])

Scroll

Kind: instance method of Scroller

Param	Type	Default	Description
[onSuccess]	function	() => {}	callback function when finish to scroll
[onFailure]	function	() => {}	callback function when failed to scroll

Scroller.Scroller

Kind: static class of Scroller

new Scroller(options)

Creates an instance of Scroller.

Param	Type
options	Options