Jerky Parallax In Ie7-8

I've introduced a basic parallax effect into a site that I'm developing. It runs smoothly in Chrome, Firefox and IE9; but it's really jerky in IE7 and IE8. I've looked at far more

Solution 1:

Please check this setting (in comments) How can I check browser smooth scrolling support via Javascript? .

If it disabled - it is normal.

As I understand this http://www.ianlunn.co.uk/demos/recreate-nikebetterworld-parallax/ is example, not your code. And if smooth scrolling is disabled - it has "jerky" effect (I have disabled smooth scrolling is Chrome, Opera and IE8).

Reason in scrolling principle. If this setting is disabled - it works like permanent +100px. If it is enabled - it works like 10 times per 50ms, each time +10px.

---

UPDATE

For more performance you can do this things:

• Write your own code without plugins

• Build events calls based on current scrollTop interval, not on every scroll call

• Cache jquery nodes at the beginning

• Main principle - less node manipulations = more performance

I have written similar effect on jquery - you can see it here http://www.thecommoditycode.com/ambersoftware/ and use it principles

Solution 2:

I know that it's a bit late to answer this but it might help people in the future - the problem is that you're using:

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

to make the images behind the parallax fullscreen, you need to use another method.

Remove this code your parallax will be lovely and smooth.