Author: | ranjiayu |
---|---|
Views Total: | 3,774 views |
Official Page: | Go to website |
Last Update: | December 14, 2019 |
License: | MIT |
Preview:

Description:
The scroll-animate-to JavaScript library animates scrolling to a specified point within the document.
Supports both horizontal and vertical scrolling.
How to use it:
Install and import the library into your main JS.
# NPM $ npm install scroll-animate-to --save
import ScrollTo from 'scroll-animate-to'
Or include the compiled JavaScript file ‘scroll-animate-to.min.js’ on the page.
<script src="scroll-animate-to.min.js"></script>
Create a new ‘ScrollTo’ object and specify the target element the page scrolls to.
let myScroll = new ScrollTo({ target: document.getElementById('target') })
Scroll the page to this target element.
myScroll.scroll()
Apply a custom easing function to the animation.
let myScroll = new ScrollTo({ target: document.getElementById('target'), animationFn: 'easeIn' // "easeIn", "easeOut", "easeInOut", "linear" })
Set the duration of the animation. Default: 1000ms.
let myScroll = new ScrollTo({ target: document.getElementById('target'), duration: 2000 })
Set the axis the page should scroll in. Default: y (vertical).
let myScroll = new ScrollTo({ target: document.getElementById('target'), axis: 'x' })
Specify the parent container. Default: the whole window.
let myScroll = new ScrollTo({ target: document.getElementById('target'), container: 'window' })
Execute a callback when the scroll ends.
let myScroll = new ScrollTo({ target: document.getElementById('target'), callback: function(){} })
Changelog:
v1.0.4 (12/14/2019)
- format code && publish