/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 vote312 views2 answers
Why we use react js
Javascript React
1 vote329 views1 answer
React-native razorpay
Javascript React
1 vote338 views1 answer
How to change the tab text in React
Javascript React
0 vote401 views1 answer
Button click open external link react
Javascript React
0 vote351 views4 answers
How to pass data between routes in react
Javascript React
0 vote347 views1 answer
Image continuous changing div react
Javascript React
0 vote313 views1 answer
React native webview disable touch
Javascript React
-1 vote345 views1 answer
React window navigate
Javascript React
0 vote338 views1 answer
Apache react deploy "conf"
Javascript React
1 vote341 views1 answer
Tab navigation react-native without title
Javascript React