Popularity
0.6
Growing
Activity
0.0
Stable
6
0
2

Programming language: JavaScript
License: MIT License
Tags: UI Animation    

react-scroll-rotate alternatives and similar libraries

Based on the "UI Animation" category.
Alternatively, view react-scroll-rotate alternatives based on common mentions on social networks and blogs.

Do you think we are missing an alternative of react-scroll-rotate or a related project?

Add another 'UI Animation' Library
Deliver Cleaner and Safer Code - Right in Your IDE of Choice!
sponsored www.sonarlint.org

Popular Comparisons

Developer Ecosystem Survey 2022
sponsored surveys.jetbrains.com

README

react-scroll-rotate (demo)

Very simple react component for rotate element based on scroll position

NPM

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


*Note that all licence references and agreements mentioned in the react-scroll-rotate README section above are relevant to that project's source code only.