/Javascript/React/React lottie player on hover

React lottie player on hover

import lottieJson from './lottie.json'


const [play, setPlay] = useState(false);

function startPlay() {
  setPlay(true);
}

function stopPlay() {
  setPlay(false);
}

<div className="col-md-5" onMouseEnter={startPlay} onMouseLeave={stopPlay}>
  <Lottie
    className={"img-fluid"}
    animationData={lottieJson}
    mode={"bounce"}
    speed={2}
    play={play}
    loop
    style={{width: "400px", height: "400px", background: "#FFFFFF"}}
    ref={lottieRef}
  />

</div>

Similar codes

0 vote156 views1 answer
Comment creer des switch en react js
Javascript React
0 vote165 views1 answer
React-native firebase v9+ config
Javascript React
0 vote148 views1 answer
Dropzone react view photo
Javascript React
2 votes132 views1 answer
How to make react router Link active
Javascript React
0 vote158 views1 answer
Unistall react node package
Javascript React
0 vote138 views1 answer
React testing library for hooks
Javascript React
0 vote143 views1 answer
How to update the react version in next js app
Javascript React
0 vote166 views1 answer
Attempted import error: 'Map' is not exported from 'react-leaflet' (imported as 'LeafletMap').
Javascript React
0 vote133 views1 answer
Date picker type react
Javascript React
0 vote278 views1 answer
How to prevent clickjacking in react js
Javascript React