Slashgear / use-reduced-motion

React Hook to detect option that reduce browser animation and motion for A11Y

Welcome to use-reduced-motion 👋

React hook to detect user reduced motion feature

Install

npm install use-reduced-motion
yarn add use-reduced-motion

Usage

Use directly in your component. Pass the boolean value to your JS animated component to stop it.

import React from "react";
import { useReducedMotion } from "use-reduced-motion";
import { AnimatedDiv } from "../somewhere";

export const MyExampleComponent = () => {
  const stopMotion = useReducedMotion();
  return <AnimatedDiv pause={stopMotion} />;
};

Author

👤 Antoine CARON [e-mail]

• Website: http://slashgear.github.io/
• Twitter: @Slashgear_
• Github: @Slashgear

Show your support

Give a ⭐️ if this project helped you!

📝 License

Copyright © 2020 Antoine CARON [e-mail].
This project is MIT licensed.

---

This README was generated with ❤️ by readme-md-generator