none
filter-alpha-opacity fails if the element is taller than 2048px, IE7 Vista

    Question

  •  

    While designing a site and using lightbox i found that if the div element was taller than 2048px the filter would fail and there would be no opacity.

     

    Has anyone come accross this before? Is there a work around?

     

    I'm wondering if it's a DirectX10 issue as it doesn't occur on XP machines.

     

    The html below will recreate the results.

    Code Snippet

    <html>
     <body>
      <div style="width: 100px; height: 2049px; background: black; filter:alpha(opacity=50);"></div>
     </body>
    </html>

     

     

    Thursday, August 07, 2008 3:09 PM

All replies

  • No one else experience the same thing?

    Tuesday, August 19, 2008 8:26 AM
  • Hi Alex

    Got the same problem on 4096 pixels.
    Its only appears on Vista (with SP1). Testet XP and Windows Server 2003 with IE7 - no problems.
    I using an ATI graphiccard on the Vista computer - could it be a bug in the driver?

    You have any new infos?
    Thursday, January 08, 2009 8:39 AM
  • I can't reproduce it (at any height) on IE7(XP) or IE8PR1(XP)...

    However it renders 100% opaque on IE6(XP) for me.

    Friday, January 16, 2009 6:02 PM
  • yeah thats right - its only appears on Vista based pc's - not on XP.
    Looks for me a problem with Aero or DirectX10 or ATI driver.
    You can try it also with the popular free Javascript libary Lightbox - it happens too.

    Here is my list of systems which I has tested this bug:

  • Windows Vista SP1, IE7, ATI: Problem happens 
  • Windows XP SP3, IE6, Virtual PC: Not
  • Windows XP SP3, IE7, Nvidia: Not
  • Windows XP SP3, IE8, Virtual PC: Not
  • Windows Server 2003 SP2, IE7, XGI: Not
Wednesday, January 21, 2009 1:00 PM
  • This is a graphics card issue. IE7 use DXTransform to render the transparent layer, and with values over 2048 (or 4096 on some graphics cards), it will fail to process the layer.

    I suggest setting the height and width of the div element to 100% using the !important attribute as this will use the viewport height. You may run into problems when displaying the browser window on monitors which large resolutions (>2048 wide).
    • Proposed as answer by Gibletto Wednesday, January 21, 2009 3:56 PM
    Wednesday, January 21, 2009 3:28 PM
  • Its not appearing if I using Vista and IE7 in a Virtual Machine - so you can't generally say "This is a graphics card issue". Its only appears on some configuration and not every time. Normaly you should not have problems rendering pages with more than 4000 pixels - you can check it: IE6 (the older version) and IE8 (the newer version) dont have this bug right now. Also no bug in Firefox, Safari, Opera and Chrome.

    I will ask one of my collegs for testing with Nvidia and Vista - if the test will not fail this bug can be declareded as "using of ATI graphic + Vista + IE7 Bug".
    Wednesday, January 21, 2009 4:13 PM
  • Yeah, howdy, i found this on my machine vista ulitmate with ie7.
    Trouble was, resizing an iframe that i wanted partial opacity, like 75% but when it went over 4000px, the opacity failed and i couldn't get it back.
    Thanks for your information, the way i fixed it was to turn off the opacity filter when the size was over 3999px and turn it back on when it went under.

    vScrollHeight = myIframe.Document.body.scrollHeight;
    if(vScrollHeight > 3999){
            myDiv.style.filter = "";
    } else {
            myDiv.style.filter = 'alpha(opacity=75)';
    }

    so the myDiv is around the myIframe, which inherits the opacity from the parent.  this is just the code for the IE handler anyway. Didn't understand what was going on, thanks for shedding light on it. Yeah, tried setting the opacity to 100%, but that didn't work.
    had to totally kill the filter.

    Thursday, April 16, 2009 5:44 AM
  • Hello,

    I am also facing the same problem?

    Is this the only way to not to show the lightbox  when size is more than 3999?

    Is there any other way with which we can fix this?

    Please help,
    Ashish
    Tuesday, May 12, 2009 2:42 PM
  • We are experiencing the same problem on IE8, even in IE7 mode, on Win XP SP2, Nvidia 8400GS graphics card. The threshold seems to be around 7000x7000px for the DIV dimensions. With us, it seems to be that the threshold is related to the surface of the DIV, not height or width specifically.

     

    Does anyone have any new information about this problem?

    Tuesday, April 06, 2010 9:42 AM