0.0.7 • Published 5 years ago
react-scroll-rotate v0.0.7
react-scroll-rotate (demo)
Very simple react component for rotate element based on scroll position
Install
npm install --save react-scroll-rotate
Usage
import React, { Component } from 'react';
import { ScrollRotate } from 'react-scroll-rotate';
function MyTitleComp(props) {
return (<MyTitleWrapper>
Hello <ScrollRotate><span>world</span></ScrollRotate>
</MyTitleWrapper>)
}
Props
Property | Type | Default | Description |
---|---|---|---|
target | string | null | Target element id. By default it will use window scroll |
throttle | number | null | Use 'throttle' prop to invoke the update once in X seconds |
from | number | 0 | Rotation start point |
to | number | 360 | Rotation end point |
method | string | 'px' | Use 'perc' to change rotation based on scroll percantges. |
loops | number | 1 | When using method 'perc', define how many loops component will do while scrolling to bottom |
animationDuration | number | 0.1 | Animation duration |
License
MIT