IE Background Cache Fix 12

A while back a lot of people where covering how to work around the bug that IE always reloads background images from the server, leading to your UI flickering. Dean wrote one and lots of others wrote the same thing. Today, I saw this simple workaround (from a fellow Googler who worked at Microsoft before):

document.execCommand("BackgroundImageCache", false, true)

Much simpler but makes me wonder why this is not the default setting?

  • http://www.nczonline.net/ Nicholas C. Zakas

    I’ve actually wondered about this “bug” for a while. I’m sure somewhere along the line this decision was made for a logical reason…maybe they didn’t anticipate how much background images would be used, or maybe they thought there was some use case under which it would be desirable not to cache the background image. I’m generally not big on overriding things that seem to be design decisions (which this seems to be). I’ve never really thought this was a “bug”…bugs don’t usually have switches that say “turn off bug”. :)

  • http://www.thomasfrank.se Thomas Frank

    Brilliant :-D, though it has been mentioned before:
    http://www.mister-pixel.com/#Content__state=is_that_simple

    @Nicholas:
    I agree – it’s not a bug.
    It’s yet another Microsoft conspiracy ;-), revealed here:
    http://www.bazon.net/mishoo/articles.epl?art_id=958#gen5

  • http://erik.eae.net Erik Arvidsson

    It is fixed in IE7 by the way so I would definitely call this a bug. A bug by design :-)

    Thomas: I saw that this had been mentioned before but since I didn’t know about it before I thought I would spread the word.

  • Pingback: Quick fix for annoying bug in Internet Explorer 6 – Interaction Design Blog()

  • Patrick Corcoran

    This is a helpful tip.

    I have noticed only one problem with this, and it seems to occur in IE6 on Windows Server 2003 platforms. The execCommand fails and throws an “Invalid Argument” error.

    A try/catch around the command seems to do the trick.

  • Pai

    I am a new to Programming and held up with this issue….. I got an image as a background image for my header.(header is 10% of my screen). when ever the page refreshes and gets time to load, i see that the image missing giving the user a feel that it is not there.Once the page is loaded completely it appears again. I tried the above solution by giving that code in my onload function. But it didnt help. can any one help me to solve this?

  • http://erik.eae.net Erik Arvidsson

    Yeah, at Google we use a try catch around it for exactly that reason.

  • Nir Segev

    Having the same issue with a map on aspx page, with update panel located on the same page.
    every time the update panel being updated the map flickers,
    does anyone know a way to prevent this from happening?
    I am using IE7

  • pl

    It does not work, if you change css dinamicly (menu for example).
    To prevent this, add any tag with your style and set it invisible.

    imho, if there is no element uses any style, IE will download background image every time element with this style appears.

  • greg

    i have been chasing this around for days now – I have tried this fix, the php hack, the htacess fix – nada – tried on windows XP, vista, 6 and 7.

    the background redraws – no matter what. The only way I can get it not to is to include the css styles in the html document – which I can’t do – way too many includes.

    Here are the files – if you go between them – the background should repaint -that is my experience..

    http://www.por7al.com/chargersguide/2.html
    http://www.por7al.com/chargersguide/1.html

    Any help is appreciated

    There are no issues in ffox or on a mac.

  • Miriam

    I am having the same issue with background flickering in Explorer and from my experience it is not fixed in IE 7. Any other workaround?

  • http://www.ecodelphinus.com Gooitzen

    The CSS solution on this page:

    http://ieflicker.com/

    Worked for me in IE8 and in the compatibility mode.

    YMMV.