0.0.2 • Published 4 years ago
memtive-interactive v0.0.2
memtive-interactive
A Component Library for interactive animations created in After Effects, Uses BodyMovin, Lottie and GASP for the rendering engine
Example
Here's an example of the library
Install
npm install --save memtive-interactiveUsage
ScrollAnimation
The ScrollAnimation component loads JSON keyframe animations, a scroll event controls the playback of the animation
import React, { Component } from 'react'
import { ScrollAnimation } from 'memtive-interactive'
import animation from './animation.json'
class Example extends Component {
render() {
return (
<ScrollAnimation
data={animation}
scrollArea={5000} />
);
}
}
export default Example;Props
| Props | Type | Default Value | Description |
|---|---|---|---|
| data required | JSON | <none> | Json exported from the BodyMovin plugin from After Effects |
| scroll optional | Integer | 1000 | The scroll distance for the animation playback in pixels |
License
MIT © abhishekpratapa