Menu
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?
891
Three things can cause IE 11 flickering/choppy/delay for fixed position element while scrolling: If you have an "overflow: auto;" on the parent container element, remove it. Remove background-attachment:fixed; from the fixed position element. Remove border-radius from the fixed position element (mobile IE only). Share Improve this answer
Another reason for flickering can obviously be another fixed element inside the fixed element. At least that was the reason in my case. The false behaviour of Edge appears to be random. Share Improve this answer Follow answered Feb 11 '18 at 11:34 webdesignwienwebdesignwien 1
position: fixed; is basically the same as position: absolute; except that when the user scrolls the page, the element does not scroll with it, it just says exactly where it was. There are many pages that want to use this in order to position logos or menus. What is wrong with position: fixed;?
IE6 doesn't support position fixed. If you really need this to work in IE6, use conditional comments to serve an IE only CSS file and fake position:fixed with CSS expressions. (edited to correct IE version info.) Show activity on this post. I recently wrote a jQuery plugin to get position:fixed working in IE 6+.
Three things can cause IE 11 flickering/choppy/delay for fixed position element while scrolling:
If you have an "overflow: auto;" on the parent container element, remove it.
Remove background-attachment:fixed; from the fixed position element.
Remove border-radius from the fixed position element (mobile IE only).
50
A hardware acceleration technique as follow caused mine.
outline: 1px solid transparent;
Remove it and it might be the cause.
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
