/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 vote223 views1 answer
How to solve "Unexpected use of comma operator no-sequences" error in react
Javascript React
3 votes222 views3 answers
Update react app
Javascript React
7 votes212 views3 answers
Install node-sass version for react
Javascript React
2 votes171 views1 answer
Change color of strike through line of text in react native
Javascript React
0 vote178 views2 answers
React foreach loop
Javascript React
0 vote211 views1 answer
React Native BUILD FAILED on run-ios
Javascript React
2 votes196 views2 answers
React native position absolute center
Javascript React
0 vote184 views1 answer
React event for modals
Javascript React
4 votes214 views1 answer
Use of useNavigate from 'react-router-dom'
Javascript React
1 vote196 views3 answers
React redux how to change object value in reducer
Javascript React