/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 vote202 views2 answers
Get location from brwoser react
Javascript React
18 votes206 views6 answers
React-native make android apk
Javascript React
1 vote197 views1 answer
Div onchange react
Javascript React
0 vote219 views2 answers
Combine p5 with react
Javascript React
1 vote258 views1 answer
React native tabbed sticky view
Javascript React
0 vote198 views1 answer
React native navigation remove top header screen
Javascript React
0 vote216 views1 answer
How to add debounce in react redux js
Javascript React
0 vote213 views1 answer
React native cors origin
Javascript React
1 vote218 views5 answers
Enzyme adapter react 17
Javascript React
0 vote239 views1 answer
Change module name react native android studio
Javascript React