change background color document with javascript

Question

I am using the following code :

    <%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="WebApplication3.Site1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="style.css" rel="stylesheet" />
    <script type="text/javascript">

        function change(color) {
            document.bgColor = color;
        }

    </script>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">

        <p>&nbsp;</p>
        <div class="green">
            <div id="slatenav">
                <ul>
                    <li><a href="WebForm3.aspx" id="green" onclick="change('green')">Home</a></li>
                    <li><a href="WebForm4.aspx"  id="red" onclick="change('red')">About Us</a></li>
                </ul>
            </div>
        </div>
        <div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
        </div>
    </form>
</body>
</html>

Why it isn't working properly?

sgeddes · Accepted Answer · 2013-03-26 01:24:06Z

3

While you shouldn't be using document.bgColor, it should still work. The problem isn't that -- but rather that you're using it with links which are cancelling the javascript (the link is loading a new page).

Give this a try:

<script type="text/javascript">
     function change(color) {
     document.bgColor = color;
     return false;
     }
</script>
<div id="slatenav">
    <ul>
        <li><a href="WebForm3.aspx" id="green" onclick="return change('green');">Home</a></li>
        <li><a href="WebForm4.aspx"  id="red" onclick="return change('red');">About Us</a></li>
    </ul>
</div>

And the sample fiddle

It won't load the new page, but the Javascript will fire off. And as others have suggested, use document.body.style.backgroundColor.

answered Mar 26, 2013 at 1:24

sgeddes

62.9k7 gold badges67 silver badges85 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

sgeddes Over a year ago

@user1799345 -- np, glad we could help!

Thomas Oeser · Accepted Answer · 2013-03-26 01:21:09Z

1

The document.bgColor is deprecated use document.body.style.backgroundColor instead

From https://developer.mozilla.org/en/docs/DOM/document.bgColor

answered Mar 26, 2013 at 1:21

Thomas Oeser

1281 silver badge8 bronze badges

Collectives™ on Stack Overflow

change background color document with javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related