2
.leavesbg {
  background: #f7fff7 url(/images/leaves4.png) repeat-y fixed 480px top;
}

So if the page is being viewed at greater than 800px wide, I'd like to move the bg image half that much further to the right. That is to say, if they were viewing it in 1024x640 for example, I'd like to add 112 ((1024-800)/2) to the width (so ... fixed 592px top;

Here's my jquery attempt to move it

function moveBG() {
    var bgoffset =480;
    var pagewidth = $('body').width();

    if (pagewidth>800) {
        bgoffset=pagewidth-bgoffset;
        bgoffset=bgoffset/2;
    }
    $('.leavesbg').css(background-position: bgoffset +'px top');
}


    $(document).ready(function(){
    moveBG();
    $(window).resize(moveBG);

});

I expect I'm just forgetting something simple, but I'm still relatively new to jQuery.

aslum
  • 11,774
  • 16
  • 49
  • 70

3 Answers3

1
bgoffset=bgoffset+'px top';
$('.leavesbg').css('background-position', bgoffset );

So I was doing some of the original math wrong (but that's not terribly relevant to the actual question), but as far as I can tell the actual error in my code was the "change the css" line, and I think this works. There's probably a better and more efficient way to to this then the cobble I have have above, so I'd still welcome suggestions for how to code it better. Thanks.

aslum
  • 11,774
  • 16
  • 49
  • 70
0

I answered this in a similar question with this fiddle:

http://jsfiddle.net/9ZgWg/26/

Here's the original question: centering an img within a div - both being resized

Community
  • 1
  • 1
Milimetric
  • 13,411
  • 4
  • 44
  • 56
0

Good, you caught the syntax error in .css(attr,value) assignment. However if your pagewidet <= 800 the background-position is "480" not "480px top;" which I think is what you want. Also remember the common gotcha with css, if your element with a class of '.leavesbg' has a style attribute after the class attribute, and the style has 'background-position', it wins.

Cos Callis
  • 5,051
  • 3
  • 30
  • 57
  • the `bgoffset=bgoffset+'px top';` is outside the `if` statement, so if width is <800 the bgoffset gets the `px top` added to it. – aslum Apr 27 '11 at 20:23