Skip navigation
b3vegan
b3vegan Calculating status...
Currently Being Moderated

Flash wmode="transparent" not working in IE

Sep 12, 2011 4:18 PM

For the life of me, I can't figure out how to make my swf transparent in IE. I've tested in Firefox, Opera, Safari, and Chrome on Windows 7 and it works fine, but in IE it is showing a black opaque background. I've seen the same issue on Safari on the Mac.

 

I now have 3 different variations of the code on the page, all 3 variations being transparent in Firefox, Opera, Safari, and Chrome on Windows 7, and all 3 variations NOT being transparent in Internet Explorer.

 

For 'attempt 2', I'm using swfobject which in theory should generate the correct code.

 

Page link is http://www.bikramyogabrighton.com/index_test_swf.php

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Test page</title>
</head>

 

<body style="background-color:#CC6633;">
    <!--
    ATTEMPT 1
    -->
    <object width="450" height="375">
        <param name="movie" value="flash/sun.swf">
        <param name="wmode" value="transparent" />
        <embed src="flash/sun.swf" width="450" height="375" wmode="transparent"/></embed>
    </object>

 

    <!--
    ATTEMPT 2
    -->
    <script type="text/javascript" src="/js/swfobject/swfobject.js"></script>
    <script type="text/javascript">
        swfobject.registerObject("myFlashSun", "10.3.0", "/js/swfobject/expressInstall.swf");
    </script>
    <div id="flashsun">
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="450" height="375" id="myFlashSun">
            <param name="movie" value="flash/sun.swf" />
            <param name="wmode" value="transparent" />
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" data="flash/sun.swf" width="450" height="375">
                <param name="wmode" value="transparent" />
            </object>
            <!--<![endif]-->
        </object>
    </div>
   
    <!--
    ATTEMPT 3
    -->
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab# version=7,0,0,0" width="450" height="375" id="navigation">
     <param name="wmode" value="transparent" />
     <param name="allowScriptAccess" value="sameDomain" />
     <param name="movie" value="flash/sun.swf" />
     <param name="quality" value="high" />
     <param name="bgcolor" value="#000000" />
     <embed src="flash/sun.swf" quality="high" bgcolor="#000000" width="450" height="375" name="start" allowscriptaccess="sameDomain" wmode="transparent" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
    </object>
   
   
</body>
</html>

 


Any help much appreciated.

15694 Views   7 Replies   Latest reply: Gaston Meskens, Dec 21, 2011 4:10 AM
 
Replies
  • adninjastrator
    Currently Being Moderated
    1. adninjastrator,
    Sep 12, 2011 5:18 PM   in reply to b3vegan
    Report

    Looks exactly the same in IE or FF to me.... tested on 2 different machines, Windows Vista on one, Windows XP on another.

    Adninjastrator

     
    |
    Mark as:
  • b3vegan
    Currently Being Moderated
    2. b3vegan,
    Sep 15, 2011 8:09 AM   in reply to adninjastrator
    Report

    Hi adninjastrator,

     

    Thanks for taking the time to look at this.

     

    When you say they are exactly the same, do you mean they all have the opaque black background? Or transparent with the page background color showing through?

     

    Can you see what might be wrong with my code? Or is it possible that the SWF itself could have some wrong setting?

     

    Cheers,

     

    b

     
    |
    Mark as:
  • adninjastrator
    Currently Being Moderated
    3. adninjastrator,
    Sep 15, 2011 9:28 AM   in reply to b3vegan
    Report

    All 3 examples seem to render just fine in IE and FF.

    See comparison photo:

    http://www.cidigitalmedia.com/web_devel/background.jpg

    If not working for you, try clearing your cache to remove any old, non working versions.

    Test on some other machine besides yours.

    Code looks fine and seems to work.

    Best wishes,

    Adninjastrator

     
    |
    Mark as:
  • b3vegan
    Currently Being Moderated
    4. b3vegan,
    Sep 16, 2011 11:55 AM   in reply to adninjastrator
    Report

    Hi Adninjastrator,

     

    I tried clearing the cache and making sure I was using the latest version. Even so, I'm still seeing the opaque background on Internet Explorer version 9 on Windows 7 64bit and on Safari on the Mac OS X Lion.

     

    I'm wondering if it might be the swf itself. I guess the next step is to check another transparent swf in the same page and see what kind of results I get. I can't see what's wrong with the code, so it might somehow be the swf.

     

     

    Thanks mucho, Adninjastrator. I appreciate your effort in helping me thus far.

     

     

    Cheers,

     

    b

     
    |
    Mark as:
  • 12Khazar12
    Currently Being Moderated
    5. 12Khazar12,
    Oct 11, 2011 6:17 AM   in reply to b3vegan
    Report

    I have the exact same problem and I can reproduce it. It came with the new Flash Version 11.0.1.152.

     

    Apparently if you put a php or html file in an iframe you will get problems (black background) with Flash 11, IE 8 and IE 7, wmode=transparent.

    The .php/.html-file is loaded with a javascript jQuery function into the iframe, the iframe is made visible, gets a height and width with an animation(everything is done over the jQuery function) and it is packed into quite alot of tags so it is hard to find out where the error lies.

    Just putting a .html into an iframe with normal javascript doesn't seem to cause this issue.

    IE 9 and other Browsers don't have this problem.

     

    If I look at b3vegans HTML, it will show everything correctly in IE 8, which means, since I don't have the .swf-files, that the only thing I see is the orange background of the HTML-Body. But if I load it in my .php in an iframe the black boxes appear where the flashes would be.

     

    EDIT: So I found now the issue for me. The jQuery function .animate, seems to make the background black for transparent flashes inside the enlarging html-container. Also it seems like the only thing hurting the flashes is the "width" and "height" altering parts.

     

    Cheers,

    Khazar

     
    |
    Mark as:
  • Ali Neama
    Currently Being Moderated
    6. Ali Neama,
    Nov 4, 2011 10:42 PM   in reply to b3vegan
    Report

    Please vote to fix this issue:

     

    https://bugbase.adobe.com/index.cfm?event=bug&id=3019125

     

    https://bugbase.adobe.com/index.cfm?event=bug&id=3017111

     

    https://bugbase.adobe.com/index.cfm?event=bug&id=3018116

     

    Notes:

     

    1- Using Internet Explorer 9 + Flash Latest Version (11,0,1,152)= Problem with Flash (Transparent become Black)

     

    2- Using Internet Explorer 9 + Flash Older Version (10,3,162,28)= Flash is OK

     

    3- Using Internet Explorer 8 + Flash Latest Version (11,0,1,152)= Flash is OK

     
    |
    Mark as:
  • Gaston Meskens
    Currently Being Moderated
    7. Gaston Meskens,
    Dec 21, 2011 4:10 AM   in reply to Ali Neama
    Report

    Everything worked perfect on my own websites (http://www.idle-city-else.org) untill I was forced to install IE9 on my main computer. Maybe we should ask the whizzkids of Microsoft to fix the problem?

     
    |
    Mark as:
Actions

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points