CODEWITHSUNDEEP
javascripthtml
alia
alia

Reputation: 11

changing color by javascript function

In the following code , I have a javascript function and I am tring to change the backgroundColor of the page to a color passed in as a parameter. But my code doesn't work, can anybody help me what is wrong in my code?

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Changing Color</title>
<head>
    <style type="text/css">
        body {
            background-color:#ffcccc;
        }
    </style>
</head>
<body>
    <form>
        <label>color: <input type="text" name="color"> </label>
        <input name="color" type = "button" onClick = "changecolor(color.value) " value = "color">
    </form>
</body>
</html>

Javascript:

function changecolor(colour)
{
    document.bgcolor=colour;
}

Upvotes: 1

Views: 26164

Answers (3)

Bimal Sharma
Bimal Sharma

Reputation: 134

Try this code it works finely man .i have just tried it.you can use it where-ever you want.also appended the code for onmouse click and onmouseover.

<html>
    <head>
    <script language="javaScript">
    function change_background(color){
    document.bgColor = color;
    }
    </script>
    </head>
    <body>
    <form> 
    <label>color: <input type="text" name="color" > 
    </label>
    <input name="clrs" type ="button" value="getcolor" onClick = "change_background(color.value) " > 
    </form>
    <a href="#" onClick="change_background('#099')">ClickBlue</a>
    <a href="#" onMouseOver="change_background('#111')">Mouseoverblack</a>
    <a href="#" onMouseOver="change_background('#fff')">Mouseover white</a>
    </body>
    </html>`

Upvotes: 0

mightyplow
mightyplow

Reputation: 519

you have to put the function in a script block.

...

</form>
<script type="text/javascript>
  //function declaration 
</script>

Upvotes: 0

Fr&#233;d&#233;ric Hamidi
Fr&#233;d&#233;ric Hamidi

Reputation: 262919

Assuming colour contains a valid CSS color descriptor, you can write:

document.body.style.backgroundColor = colour;

Upvotes: 2

Related Questions