Container Margins / Centering

[bryannielsen]

There's an issue with wrapping the whole ul element in index.html with say a <div style="width: 960px; margin: 0 auto;">, the images all jerk to the right on the first scroll.

I haven't had a chance to div into the script and see where the problem is, but if that sounds like something that might be a quick fix, I'd love to use the script, just need to center the content :-)

Great script, thanks for your work!

[bredon]

I had a similar problem - the background images would always jump 50px to the right on the first scroll and then stay there. Since I only need y-axis scrolling and I needed the background to always be centered, I simply updated line #130 from this:
$this.css({'backgroundPosition': parseInt(newXPos) + "px " + parseInt(newYPos) +"px"});
to this:
$this.css({'backgroundPosition': "50%" + parseInt(newYPos) +"px"});

I couldn't ever figure out where that 50px was coming from, but this solved my problem so I'm happy.

[smisaacs]

The 50 comes from lines 107 and 123.

107 says grab the 1st part of the position array and strip out non-numerical characters. So if you had '50%' in there to center your item, then you have '50' left after the replace. In line 123, its saying if we aren't parallaxing the x-axis, use the value we have after the replace, which by default the browser makes into 50px. If you want to keep your x position intact, you can change line 135 to
$this.css({'backgroundPosition': currentPosArray[0] + parseInt(newYPos) +"px"});

Now this wont keep your child items inside a container, you'd have to do some extra work to check where the parent is and adjust your child based on that.