views:

272

answers:

4

I'm trying to do something unusual. I promise it has a purpose. I'm 90% sure it can't be done, but wanted to double check with geniuses.

Is it possible to have an object/embeded .swf in the page, let it be displayed, but do not allow any interaction with it. As an example, can you somehow change the youtube embed code to display the player, but not allow any interaction with it at all?

I searched flash's variable list, but didn't see anything to do this.

Thanks

+1  A: 

Use a layered approach: place a div element on top of the flash object, make it the same size and transparent. That's all. No JavaScript needed. And to make IE6/7/8 happy, this of course doesn't work, so we add a trick: a background and a zero-opacity. You may want to add the IE-only CSS in a separate file to prevent CSS invalidation.

Important: for this to work, wmode must be set to opaque (as noted by TheBrain earlier), the parent div must have a position set, the child div must have position:absolute and the width/height of the flash animation. The opacity, filter and background-color are for IE6/7/8 compatibility only. The code as-is works cross-browser (left out some details for clarity) and is demonstrated on this page in full.

Update:The width and height of the parent div element must be set to prevent some uncovered borders to creep in. By default, a div is 100% width. IE adds a left-margin and FF adds a bottom margin to the flash animation. By setting the dimensions explicitly, this will work as expected. To proof the cover is placed correctly, change the color and the opacity of the cover-div. This change is also updated in the demo page.

<div style="position:relative;width:728px;height:90px;">
    <div style="position:absolute;
          width:728px;height:90px;
          background-color:white;
          opacity:0;filter: alpha(opacity=0);">
        &nbsp;
    </div>
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
        width="728" height="90">
        <... params etc ...>
        <param name="wmode" value="opaque" />

        <embed width="728" height="90"
            type="application/x-shockwave-flash"
            wmode="opaque"
            etc-params=xyz>
        </embed>
    </object>
</div>
Abel
I'm not talking about .swf files I make. I mean taking any pre-made flash content, embedding it using object or embed tags, but not letting you click anything. I used the example of a youtube video. I know it seems pointless.
wall_russ
I've rewritten my answer, thanks for the extra information, I've added a page to show the principle. The wmode tip is courtesy of TheBrain, the rest was found by experimenting to get it to work cross-browser. Fun bit: make the div half size and your animation is half-enabled :)
Abel
That is great; thanks!
wall_russ
A: 

yes, you can. you can embed your swf inside a div and use that div tag to capture all click/keyboard events and stop them from propagating to the flash. I have no actual code right now but you can take the "disable right click on page" model and make few changes to it to handle all events + make it work on your div.id only not on the entire page.

and don't forget you need the flash to have the wmode=opaque for this to work

TheBrain
A: 

Youtube itself has an option to embed a video without the controls. Look at the Chromeless player

Iirc you have to pass version=3 as a parameter to the youtube url.

Ikke
A: 

Youtube and Adobe just came out with a new AS3 API for embedding youtube videos in flash.

You should really check out the following links: This one which walks you through how to set up the AS3: RIA CODES: YouTube Chromeless Player AS3 API

Stat1124