Framer motion

Installation

npm i framer-motion

Animation

import { motion } from 'framer-motion';


const Component = () => {

 return (
  <motion.img
   src='img/image.png'
   initial={{ opacity: 0 }}
   animate={{ opacity: 1 }}
   transition={{ delay: 1 }}
  />
 )
}

Je souhaite ajouter une animation d'opacité 0 => 1 sur une image ou collection d'images pendant 1 seconde. Vous pouvez faire cela d'une manière très simple.

Animation

import { motion } from 'framer-motion';


const Component = () => {

 return (
  <motion.img
   src='img/image.png'
   initial={{ opacity: 0 }}
   animate={{ opacity: 1 }}
   transition={{ delay: 1 }}
  />
 )
}

Je souhaite ajouter une animation d'opacité 0 => 1 sur une image ou collection d'images pendant 1 seconde. Vous pouvez faire cela d'une manière très simple.