Help: Change background color in JavaScript using Arrays

Discussion in 'JavaScript' started by s1980, Sep 2, 2008.

0
  1. #1
    Hi,

    I am trying to work out a code where I can change the background colour of an HTML page via external JS page. Please note that I will be using different HTML pages with different colours so have to use Arrays. Here is what I have so far!!!


    here is my function,


    <script language="JavaScript">

    var backColor = new Array();
    backColor[0] = '#000000';
    backColor[1] = '#111111;
    backColor[2] = '#222222';
    backColor[3] = '#333333';

    function changeBG(whichColor){
    document.bgColor = backColor[whichColor];
    }
    </script>



    What I need is to apply changeBG function (which is on an external JS file) to my HTML page without applying actions like onClick or onMouse over.

    Any help would be greatly appreciated!
     
    s1980, Sep 2, 2008 IP
  2. xlcho

    xlcho Guest

    Messages:
    532
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    0
    #2
    You can use window.onload. Something like that:
    window.onload = function() 
{
  changeBG(1);
}
    Code (markup):
    Also, you've got a syntax error in you script. You've missed a closing ' at this line:
    backColor[1] = '#111111;
    Code (markup):
     
    xlcho, Sep 2, 2008 IP
  3. s1980

    s1980 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    where should i place the window code?

    also is this ok?:

    <script language="JavaScript">

    var backColor = new Array();
    backColor[0] = '#FF0000';
    backColor[1] = '#00FF00';
    backColor[2] = '#0000FF';
    backColor[3] = '#FFFFFF';

    function changeBG(whichColor){
    document.bgColor = backColor[whichColor];
    }

    </script>
     
    s1980, Sep 2, 2008 IP
  4. s1980

    s1980 Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    I tried it and didn't work :((

    my bgColor.js consist of:

    <script language="JavaScript">
    var backColor = new Array();
    backColor[0] = '#FF0000';
    backColor[1] = '#00FF00';
    backColor[2] = '#0000FF';
    backColor[3] = '#FFFFFF';
    function changeBG(whichColor){
    document.bgColor = backColor[whichColor];
    }
    </script>

    my HTML page consist of:

    <html>
    <head>

    <script type="text/javascript" src="bgColor.js" ></script>

    </head>

    <body>

    <script>
    window.onload = function()
    {
    changeBG(1);
    }
    </script>

    </body>
    </html>

    Where did i go wrong?

    Thanks by the way for helping out :)
     
    s1980, Sep 2, 2008 IP