ansaurus

Question

Is it possible to embed an AS3 swf in a DIV layered above an embedded AS2 swf?

Answer 1

A:

I'm guessing you are doing this so that people with an updated Flash will view the AS3 version and people with older Flash will only see the AS2 version, but you're making one big mistake:

You are punishing the people with update Flash because their browser will have to download both versions, which is very wasteful, especially if the AS2 version isn't small.

TravisO 2008-12-10 19:37:46

Actually no. I'll clarify in the question...

defmeta 2008-12-10 19:40:17

As stated, the plug-in version of Flash Player is independent of what swf is being played. As long as you have a Flayer Player 9+ you can playback AS3 swfs, otherwise, no go.

discorax 2008-12-18 05:45:54

Answer 2

+3 A:

I wouldn't think that whether it's AS3 or AS2 has anything to do with it.

From the point of view of the web browser, they are both a black box that says "Flash Player Plugin". You can only have one version of the plugin installed at one time, so even though you have an AS2 and an AS3 swf, the web browser just sees that it has 2 instances of "Flash player plugin version 10"

To boil it down what you seem to be trying to do is:

Create a page:
Stick a swf in it
Add a div to the page and use CSS positioning to put it "over" the other swf
Stick another swf in that div.

So, does this work? - No Yes, very well, but you must set wmode="transparent" on your embedded flash objects (thanks grapefrukt in comments).

I ran a test: here's my source code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
<html>
    <head>
     <style type="text/css" media="screen">
      DIV{ width: 300px; height; 300px;}
      #background{ border: 1px solid green; background-color: green; z-index: 0; }
      #foreground{ border: 1px solid red; background-color: red; z-index: 50; }
     </style>
    </head>
    <body>
     <div id="background">
      <embed height="208" width="208" quality="high" bgcolor="#fff" src="bgswf.swf" type="application/x-shockwave-flash" wmode="transparent"/>
     </div> 

     <div id="foreground" style="position: absolute; left: 30px; top: 30px;">
      <embed height="208" width="208" quality="high" bgcolor="#fff" src="fgswf.swf" type="application/x-shockwave-flash" wmode="transparent"/>
     </div> 

    </body>
</html>

Results:

Without wmode=transparent, is inconsistent and minorly broken in firefox and IE. With it, does exactly what you think it should in both IE and firefox.
The swf files behave (from a layout point of view) as if they are just images. It's cool.

Orion Edwards 2008-12-10 21:08:26

Set the bottom flash' wmode to transparent and it should work, worst case you may have to set both to transparent.

grapefrukt 2008-12-10 21:10:44

Thanks ever so much Orion Edwards, and the ever helpful grapefrukt!

defmeta 2008-12-10 22:26:30

video playback in wmode=transparent is a nightmare btw!

discorax 2008-12-18 05:43:34

ansaurus

tags:

views:

answers:

Is it possible to embed an AS3 swf in a DIV layered above an embedded AS2 swf?

related questions