fixed positioned element flicker in IE only, how to solve?

javascript css internet-explorer css-position flicker
Codebeat picture Codebeat · Jan 8, 2014 · Viewed 22.5k times · Source

Weird problem in IE11, the fixed background of the following project flickers when using mousewheel or cursor keys only. This is a bug, for sure.

website: http://gerbrandy.zitemedia.nl:88/

I use a script to resize the background proportional but this is not the problem because the resize event does not fire when scrolling, so it is not a problem of the script. It has something to do with a fixed positioned element. This script works okay for several years in all other browsers.

I have no idea how to fix this. Tried several things, but don't know how to disable javascript for example but should not be the case. I'm using IE11 on Windows 8.1.

Does somebody has some same experience with this and do you know how to work around this problem?

Answer

Adamy picture Adamy · Dec 29, 2014

Three things can cause IE 11 flickering/choppy/delay for fixed position element while scrolling:

  1. If you have an "overflow: auto;" on the parent container element, remove it.

  2. Remove background-attachment:fixed; from the fixed position element.

  3. Remove border-radius from the fixed position element (mobile IE only).

Related questions

How to preserve aspect ratio when scaling image using one (CSS) dimension in IE6?

Here's the problem. I have an image: <img alt="alttext" src="filename.jpg"/> Note no height or width specified. On certain pages I want to only show a thumbnail. I can't alter the html, so I use the …

Read More
Show a message if the browser is not internet explorer 9 or greater

I would like to show my users a bar that looks like this, if: Browser is not IE; or Browser is IE but is version 8 or earlier (Note that the screenshot is just for illustration - IE 9 is supported for …

Read More
ScrollTop not working in IE

Anyone have any ideas why scrollTop isn't working in IE? It works in Chrome fine, and I don't know about firefox. (The idea of this script is to have an autoscrolling page that resets once it hits the bottom of …

Read More