framer-motion-visible

0.0.2 • Public • Published

Framer Motion - Visible

Utility React hook to trigger framer motion animations when a node is visible in the viewport.


code style: prettier

Installation

npm i framer-motion-visible

Usage

function Title({ children }) {
  const visibleAnimation = useVisibleAnimation({
    initial: { x: -40, y: 40, opacity: 0 },
    visible: { x: 0, y: 0, opacity: 1 },
  });
 
  return <motion.h1 {...visibleAnimation}>{children}</motion.h1>;
}

Development

Uses microbundle for development setup.

Following command for running a dev library build.

npm run dev

Twitter Follow

Package Sidebar

Install

npm i framer-motion-visible

Weekly Downloads

11

Version

0.0.2

License

MIT

Unpacked Size

14.1 kB

Total Files

13

Last publish

Collaborators

  • agney