useScrollAnimation

A custom react hook to make it easy to create scroll animations in React.

Based on scrollAnimation

syntax

function useScrollAnimation(options: ScrollAnimationOptions, deps: React.DependencyList = []): void;

See: ScrollElementEdge, ScrollAxis

Usage

example

import { useScrollAnimation } from 'animare/react';

function MyComponent() {
  const timeline = useAnimare(() => {
    // ...
  }, []);

  useScrollAnimation({
    timeline: timeline,
    element: document.querySelector<HTMLDivElement>('.block')!,
    start: ScrollElementEdge.Bottom,
    end: ScrollElementEdge.Top,
    startOffset: 100,
  });
}