Search code examples
javascripthtmlcssinternet-explorer-11parallax

Non-jumping parallax with IE11 - but how?


On my website, I experience - and a lot of others do on theirs - a kind of jumping/lagging effect with Internet Explorer 11 (on a Windows 8.1 machine) when creating a parallax. On Firefox for example it is working absolutely fine.

According to my research, this is a common problem with IE11 that has no solution, but I have found a website that somehow fixed the issue (or made a Workaround?!?) : http://focuslabllc.com/journal

But my website has the same issue as this one: http://negativespacealphabet.com/ What are they doing differently to get it work? I appreciate your help!


Solution

  • Best solution I have seen to this issue is to use transition on whatever properties you are using to create the parallax.

    Example, you use transform:translateY to create a parralax effect, then add:

    transition:transform 10ms linear
    

    This forces the parralax to animate smoothly. Downside, its not fully backward compatible with older browsers