jQuery parallax lags in Safari

Question

I've got a script that i'm using to create a parallax style effect. It updates the image's css left property as the user scrolls.

It looks perfect smooth in firefox, but in safari it looks extremely bugger (same as chrome but not to the extent of safari).

Are there any solutions to this issue that anyone is aware of?

Update

I'd love to show some code but it's for a client and I wouldn't want to make any of the design public.

It's using a lot of large images that are scaled based on percentage, which I think is the main issue here. After removing one of the larger images in the design, it seems to have drastically reduced the lag when scrolling.

Answer 1

It would help if you could provide an example on jsfiddle.net that illustrates the problem. That being said, you might be able to smooth out the movement in Safari and Chrome by using a CSS transition: http://developer.apple.com/library/safari/#documentation/Inte.netWeb/Conceptual/SafariVisualEffectsProgGuide/AnimatingCSSTransitions/AnimatingCSSTransitions.html

Something like this:

img {
    -webkit-transition-property: left;
    -webkit-transition-duration: 0.5s;
}

You will need to adjust the duration to achieve the desired effect. Also change the selector to match just the image in question; this example matches all images in the document.