/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

10 votes147 views1 answer
That is neither a react function component nor a custom react hook function. react component names must start with an uppercase letter. react hook names must start with the word "use"
Javascript React
-1 vote184 views1 answer
New Map() collection in react state
Javascript React
0 vote180 views1 answer
React native getstream
Javascript React
-1 vote146 views1 answer
React index.js BrowserRouter
Javascript React
0 vote219 views1 answer
OnChange react functional programming
Javascript React
0 vote158 views0 answer
React
Javascript React
4 votes187 views1 answer
How to empty form after submit react
Javascript React
0 vote203 views3 answers
Get url parameter in react js
Javascript React
0 vote201 views1 answer
Create react app run test apecific folfer
Javascript React
0 vote200 views1 answer
Warning React Hook useEffect has a missing dependency:
Javascript React