Build a component that changes the background color of a <div> when hovered over.
EasyProblem Statement
Build a component that changes the background color of a
when hovered over.
Sample Output
The <div> changes its background color to blue when hovered over.
Limits
Time: 2s · Memory: 256 MB
Code Editor
Log in to submit00:00
Try your code in this preview. Submit marks it done.
import React, { useState } from "react"; const HoverColor = () => { const [bgColor, setBgColor] = useState("white"); return ( <div style={{ backgroundColor: bgColor, width: "200px", height: "100px" }} onMouseEnter={() => { // Change the background color to blue }} onMouseLeave={() => { // Reset the background color to white }} > Hover over me! </div> ); }; export default HoverColor;