I scroll to the location of the designation (classname).
npm install react-smooth-scrollerI scroll to the location of the designation (classname).
``sh`
$ npm i -S react-smooth-scroller
`javascript`
// ES2015 imports
import rsScroller from 'react-smooth-scroller';
`javascript
rsScroller.scrollToTop();
// default option => { easing: 'easeOutQuint', duration: 1000, frame: 13, revise: 0 }
rsScroller.scrollToTop({ easing: 'linear', duration: 1500, frame: 20, revise: 100 });
`
`javascript
rsScroller.scrollToTarget('hoge');
// default option => { easing: 'easeOutQuint', duration: 1000, frame: 13, revise: 0 }
rsScroller.scrollToTarget('hoge', { easing: 'linear', duration: 1500, frame: 20, revise: 100 });
`
`javascript`
rsScroller.scroller(0, 600);
##### easing
- linear
- easeInQuad
- easeOutQuad
- easeInOutQuad
- easeInCubic
- easeOutCubic
- easeInOutCubic
- easeInQuart
- easeOutQuart
- easeInOutQuart
- easeInQuint
- easeOutQuint
- easeInOutQuint
- easeInSine
- easeOutSine
- easeInOutSine
- easeInExpo
- easeOutExpo
- easeInOutExpo
- easeInCirc
- easeOutCirc
- easeInOutCirc
- easeInElastic
- easeOutElastic
- easeInBack
- easeOutBack
- easeInOutBack
- easeInBounce
- easeOutBounce
- easeInOutBounce
#### Use with React
`javascript
import React from 'react';
import rsScroller from 'react-smooth-scroller';
class Test extends React.Component {
onScrollTop() {
rsScroller.scrollToTop();
}
onScrollTarget() {
rsScroller.scrollToTarget('hoge');
}
render() {
return (
MIT