Stylesheets - Accessibility problem when using Flash object and CSS drop menu

Author

Accessibility problem when using Flash object and CSS drop menu

Webmaster

2005-10-05, 6:29 pm

I'm working on a site that will have a typical CSS drop menu appear on all
pages. The menu is based on this example:
http://www.htmldog.com/articles/suc...ple/bones1.html

Some of the pages will contain a Flash Player 7 object placed just below the
menu where the "Lorem ipsum dolor..." text is on the above example.

The problem is the CSS navigation then falls behind the actual Flash content
which is very user unfriendly. My object code is as follows.

<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="200" height="100" id="progressive_component">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="progressive_component.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<embed src="progressive_component.swf" width="200" height="100"
name="progressive_component" align="middle" allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>

I've seen the same error on many commercial sites but not any site where it
has actually been successfully solved. Does anyone here know if a cross
browser solution exists that can get the menus in front of Flash content?

Martin Honnen

2005-10-05, 6:29 pm

Webmaster wrote:

> The problem is the CSS navigation then falls behind the actual Flash content
> which is very user unfriendly. My object code is as follows.
>
> <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="200" height="100" id="progressive_component">
> <param name="allowScriptAccess" value="sameDomain" />
> <param name="movie" value="progressive_component.swf" />
> <param name="quality" value="high" />
> <param name="bgcolor" value="#ffffff" />

Check the Flash documentation on wmode, on some platform in some browser
you can use e.g.
<param name="wmode" value="transparent">

> <embed src="progressive_component.swf" width="200" height="100"
wmode="transparent"

to have the Flash movie rendered in the same z-level as the other
content respectively to have CSS z-index determine the stacking order.

--

Martin Honnen
http://JavaScript.FAQTs.com/

Spartanicus

2005-10-05, 6:29 pm

Webmaster <spamlover@mailinator.com> wrote:

>My object code is as follows.
>
><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"

[snip rest of horrible MS code]

There is no need for crap code like that, Google for "flashsatay".

f-up to comp.infosystems.www.authoring.html

--
Spartanicus

Webmaster

2005-10-05, 6:29 pm

> to have the Flash movie rendered in the same z-level as the other
> content respectively to have CSS z-index determine the stacking order.

Thanks for this trick. I tested on Explorer and Mozilla on Windows but
unfortunately it does not work on Mozilla Linux.