Jquery document.body.background

Question

I'm having some trouble with a jquery script that is supposed to change my body element's background image when a link is pressed. It works great, the only problem I have is that the page has to have no background set in CSS, and be blank before any link is pressed, wich changes the background. The jquery this uses is really old, tried newer versions but nothing works except this one. Also, I've tried document.body.style.backgroundImage , still no success, this is maybe because of the old version this script uses. Could you figure out what's wrong here ?

  <script language="JavaScript">
    <!--

    // Copyright 2001 by www.CodeBelly.com
    // Please do *not* remove this notice.

    var backImage = new Array(); // don't change this

    // Enter the image filenames you wish to use.
    // Follow the pattern to use more images.  The
    // number in the brackets [] is the number you
    // will use in the function call to pick each
    // image.

    // Note how backImage[3] = "" -- which would
    // set the page to *no* background image.

    backImage[0] = "img/1.jpg";
    backImage[1] = "img/2.jpg";
    backImage[2] = "img/3.jpg";
    backImage[3] = "img/4.jpg";
    backImage[4] = "img/5.jpg";
    backImage[5] = "img/3.jpg";
    backImage[6] = "img/4.jpg";
    backImage[7] = "img/5.jpg";
    backImage[8] = "img/3.jpg";
    backImage[9] = "img/1.jpg";
    //-----------------------------

    function changeBGImage(whichImage){
    if (document.body){
    document.body.background = backImage[whichImage];

    }
    }

    //-->
    </script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js">
    </script>

You need to set it the same way in js as you would do in css. So you need a `url()` around your image url. — t.niese, Jan 21 '16 at 07:17
Already on Stack Overflow. Read the answers to this question below. [http://stackoverflow.com/questions/5253718/body-cssbackground-imageurl-not-working][1] Hope this helps [1]: http://stackoverflow.com/questions/5253718/body-cssbackground-imageurl-not-working — Rahul Kate, Jan 21 '16 at 07:21

score 1 · Answer 1 · answered Jan 21 '16 at 07:21

1

try this

$('body').css('background-image','url("source of your image")');

answered Jan 21 '16 at 07:21

Abhishek

411
8
19

Please improve your answer so it at least contains what you think is wrong in the OP-code and why you think your suggestion would fix it. – konqi Jan 21 '16 at 10:03

Dipak · Answer 2 · 2016-01-21T07:32:24.827

1

By JS itself, try this:

document.body.style.backgroundImage = 'url('+backImage[index]+')'

edited Jan 21 '16 at 07:32

answered Jan 21 '16 at 07:25

Dipak

6,532
8
63
87

score 1 · Accepted Answer · answered Jan 21 '16 at 07:30

1

The following code of line should work for you:

$('body').css('background-image', 'url(' + backImage[whichImage] + ')');

answered Jan 21 '16 at 07:30

Anton

2,458
2
18
30

I was happy to help :). Please, feel free to mark the answer as the correct one if it helped you. Thank you. – Anton Jan 21 '16 at 20:14

Jquery document.body.background

3 Answers3