Search code examples
javascriptdomstring-concatenationbackground-position

javascript dom concatenate background-position string / auto update background image?

I seem to have trouble with this line:

back_x += 1;
back_y += 10;           

document.getElementById('body_id').style.backgroundPosition =  back_x + 'px ' + back_y + 'px';

.css file

body
{   
   background: #000;    
background-image:url('image.jpg');
background-repeat:repeat;
font-family: Helvetica, sans-serif; font-size: 18px; line-height: 24px;
background-attachment:fixed;
}

<BODY id = "body_id"; >

Basically I'm trying to use Javascript to update the background image position which works only once within a loop and and doesn't work again thereafter. Everything else on the page runs fine. Could it be the string is not concatenated properly?

EDIT: After a couple of minutes my page runs fine then all JavaScript functions cease to work! =(

Solution

  • I don't see any problem on your code.

    But you can maybe test this:

    function updatePositionBackground(x, y) {
   document.body.style.backgroundPosition = x + "px " + y+ "px";
}

    A do a sample: http://jsfiddle.net/RN8mB/

    You can see that the background position is correctly updated.