Change color of <div> using onMouseover

javascript jquery html event-handling onmouseover
Harish R picture Harish R · Jan 19, 2014 · Viewed 10.6k times · Source

Im trying to change the color of the div using omMouse ove Event handler. From grey to black But it doesnt work.

Whats wrong here ? Also how to use onHover and onMouseout ? 

<html>

<head>
    <title></title>
    <link type="text/css" href="" />
    <script type="text/javascript" src="" ></script>    
    <style>
        div{
            height: 100px;
            width: 100px;
            background-color: grey;
        }
    </style>

</head>

<body>
    <div onMouseover="this.bgColor = '#FFFFFF'">

    </div>
</body>

<script>

</script>
</html>

Answer

Muhammad Rashid picture Muhammad Rashid · Jan 19, 2014

You can do by doing this

By tag

div:hover {
    background-color: red;
}

By div Class

.divclass:hover {
        background-color: red;
    }

By div Id

#divclass:hover {
        background-color: red;
    }

Related questions

How do I check whether a checkbox is checked in jQuery?

I need to check the checked property of a checkbox and perform an action based on the checked property using jQuery. For example, if the age checkbox is checked, then I need to show a textbox to enter age, else …

Read More
How can I know which radio button is selected via jQuery?

I have two radio buttons and want to post the value of the selected one. How can I get the value with jQuery? I can get all of them like this: $("form :radio") How do I know which one is …

Read More
HTML text input allow only numeric input

Is there a quick way to set an HTML text input (<input type=text />) to only allow numeric keystrokes (plus '.')?

Read More