/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

1 vote314 views1 answer
React variable in stirng
Javascript React
0 vote274 views1 answer
Npm i react-use-navigator-permissions
Javascript React
0 vote1.1K views1 answer
Hide react from netlify
Javascript React
0 vote328 views1 answer
Chinese icon in react native vector icons
Javascript React
-1 vote297 views1 answer
History of react js
Javascript React
47 votes352 views3 answers
How to comment in the react javascript
Javascript React
0 vote345 views1 answer
How to accept only. proper email from an input field react with functional component
Javascript React
0 vote322 views1 answer
Global keyboard shortcuts react
Javascript React
0 vote284 views1 answer
React native getstream
Javascript React
0 vote311 views1 answer
Making a react js website project ready for hosting
Javascript React