how to add hover effect in react js code example
Example 1: react html mouseover
function changeBackground(e) {
e.target.style.background = 'red';
}
return (
<div className="App">
<button onMouseOver={changeBackground}>Hover over me!</button>
</div>
);
Example 2: react css hover animation
npm install style-it
*********
import React from "react";
import Style from "style-it";
class UrClass extends React.Component {
render() {
return Style.it(
`
.myDiv:hover {
color:red;
transform: scale(1.001);
background: #f0c14b;
}
`,
<div className="myDiv">sample text</div>
);
}
}
export default UrClass;