Change color of div with javascript in Firefox

Question

I have a div with some text, I want to change its background color on "onmouseover" event, its working fine in Internet Explorer but not working at all in Firefox.

Please answer.

Every attempt would be respected.

Thanks in advance...

what have you tried? and your question says it's working in Firefox, but not Firfox??? — clairesuzy, May 07 '11 at 12:42
It works fine in firefox but doesn't work at all in firefox?? Please show us the code you are using. — sosborn, May 07 '11 at 12:42
please post your source code here so more optimal solution you will get — Vishwanath Dalvi, May 07 '11 at 12:51

score 2 · Accepted Answer · answered May 07 '11 at 13:07

2

a Pure javascript solution for your problem tell if it works for you

<div onMouseOver="this.style.backgroundColor='#CCFF99';"
onMouseOut="this.style.backgroundColor='#FFFFFF';" ">

Hello Welcome Testing Bg color on MouseOver 
</div>

Demo

jsfiddle.net/577nc/1

answered May 07 '11 at 13:07

Vishwanath Dalvi

35,388
41
123
155

Thanks a lot, please try answer this thread also:http://stackoverflow.com/questions/5920979/center-a-table-in-internet-explorer – Subodh Bansal May 07 '11 at 13:21

user599270 · Answer 2 · 2011-05-07T13:11:58.230

The following code works in firefox:

       <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <style>
            #div_to_change_colour {
                background: rgb(255, 0, 0);
            }
        </style>
        <script type="text/javascript">
            function changeColor(objectPassedIn){
                objectPassedIn.style.background = '#CCC';
                objectPassedIn.style.width = '200px';
            }
        </script>
        <title></title>
    </head>
    <body>
        <div id="div_to_change_colour" onmouseover="changeColor(this)">
            text inside div
        </div>
</body>
</html>

The problem you may have been facing is if you set the divs background color with 'background-color'. The above code uses 'background' to set the divs color and this can then be overided with javascript.

score 1 · Answer 3 · answered May 07 '11 at 17:42

1

want to change its background color on "onmouseover" event

also you can make it using the simple CSS without any javascript code:

.myDiv {
 background:#ffffff;
}
.myDiv:hover {
  background:#cccccc;
}

answered May 07 '11 at 17:42

qstream

11
2

Change color of div with javascript in Firefox

3 Answers3