locked
IE6 with runtimeStyle.backgroundImage = "none" requests a file called "none" RRS feed

  • Question

  • [EDIT: changed the thread title to more accurately reflect the source of the problem, see following posts]

     

    I'm fiddling the use of 24-bit PNG background images using the AlphaImageLoader filter and setting the background-image to none in my IE6-specific CSS (included by conditional comments). This works fine for the display, but IE6 seems to think that:

     

     background-image: none;

     

    in my CSS means the same as:

     

     background-image: url(none);

     

    and it tries to download an image with the relative URL of "none". This can clearly be seen in my server logs and using the Charles web debugging proxy.

     

    I've now added a rewrite rule to the server, so at least the requests for "none" get a quick empty 200 response, rather than a large 404 page. But it would be nice if IE6 could refrain from trying to download images called "none" when I've asked for no image to be used!

     

    Does anyone know any other ways to specify no background image in IE6 using CSS?

    Thursday, June 12, 2008 9:29 AM

Answers

  • Aha, the modification from pluitsolutions.com does in fact fix the problem!

     

    It would seem that the commonly-used expression to fix IE6 with 24-bit PNG images uses flawed logic, and if there are any images in the page that _aren't_ in PNG format, there is a request for "none" for each one of them.

     

    My demo pages are at: http://www.fonant.com/IE6_test_png/ - the first page is the broken one, which makes requests for "none", and the second page has the fixed expression script.

     

    Hope this helps anyone else with the same problem.

    Thursday, June 12, 2008 12:34 PM

All replies

  • Ah, the problem is actually caused by a behavior expression that does this:

     

    this.runtimeStyle.backgroundImage = "none"

     

    so it's a javascript problem, not a CSS problem...

    Thursday, June 12, 2008 9:54 AM
  •  

    I'm unable to reproduce this behaviour.  In IE6 a CSS containing background-image: none behaves as expected, I see no requests for none generated.  Can you provide a small repro?

     

    A work-around might be to simply not include the background-image style atribute at all for IE6.

     

     

     

     

    Thursday, June 12, 2008 10:05 AM
  • And even using a tip from the MS documentation (http://samples.msdn.microsoft.com/workshop/samples/author/dhtml/refs/background-image.htm), I find that using:

     

    this.runtimeStyle.backgroundImage = "url('')"

     

    also results in a request to the server for a file with the relative URL of "none".

     

    Looks like a bug in IE6?

    Thursday, June 12, 2008 10:08 AM
  • Thanks Anthony.

     

    Sorry, I started along the wrong line of enquiry, as it's the behaviour expression I'm using that causes the problem, not the plain CSS.

     

    Within an expression I'm looking for any PNG images, and if a PNG is found I use an expression that has this in it:

     

      this.runtimeStyle.backgroundImage = "none",
      this.runtimeStyle.filter = "progidBig SmileXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",

     

    Some quick tests show that

     

      this.runtimeStyle.backgroundImage = "banana",

     

    triggers a javascript error (invalid propterty) and that all of these different options:

     

      this.runtimeStyle.backgroundImage = "none",

      this.runtimeStyle.backgroundImage = "url('')",

      this.runtimeStyle.backgroundImage = "",

     

    cause a request by IE6 to the server for a file called "none".

     

    I'll see if I can produce a quick demo page for you to have a look at.

     

    My CSS works in this order:

    1) Load standards-compliant CSS for modern browsers

    2) Include additional fixes for IE6 using conditional comments

     

    so leaving out the background-image isn't currently possible, as my IE6 CSS fixes are loaded after the main style sheet.

    Thursday, June 12, 2008 10:18 AM
  • Other people finding the same problem:

     

    http://www.pluitsolutions.com/2008/04/11/solving-css-png-fix-background-none-call/

     

    he limits the number of requests, but I don't think this fixes the problem.

     

    And someone else has the same problem, see comment on Dec 29:

     

    http://www.komodomedia.com/blog/2007/11/css-png-image-fix-for-ie/?cp=5

    Thursday, June 12, 2008 10:26 AM
  • Aha, the modification from pluitsolutions.com does in fact fix the problem!

     

    It would seem that the commonly-used expression to fix IE6 with 24-bit PNG images uses flawed logic, and if there are any images in the page that _aren't_ in PNG format, there is a request for "none" for each one of them.

     

    My demo pages are at: http://www.fonant.com/IE6_test_png/ - the first page is the broken one, which makes requests for "none", and the second page has the fixed expression script.

     

    Hope this helps anyone else with the same problem.

    Thursday, June 12, 2008 12:34 PM