/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 vote224 views1 answer
React native no android sdk found
Javascript React
0 vote209 views1 answer
Node_modules/react-native-paper/lib/module/core/Provider.js
Javascript React
1 vote239 views1 answer
@react-google-maps/api npm
Javascript React
0 vote282 views1 answer
Setstate to false after 10 sec react native
Javascript React
126 votes327 views4 answers
Npm create react app
Javascript React
97 votes213 views8 answers
Create react app
Javascript React
0 vote219 views1 answer
Testing library react hooks
Javascript React
2 votes240 views2 answers
Create stack navigator has been moved to react-navigation-stack
Javascript React
0 vote244 views1 answer
TextInput cursor not shown react native
Javascript React
15 votes226 views5 answers
React svg
Javascript React