CSS Menu does not appear over flash

MECU picture MECU · Mar 30, 2009 · Viewed 6.9k times · Source

I have a drop-down/multi-level CSS menu on a page. The menu however doesn't appear over a flash chart I have. The apparent fix seems to be to put wmode:transparent (or opaque), but that doesn't work for me. I have also tried setting the z-level in the CSS to very high values (2000) but that doesn't work either.

In addition, I'm using open-flash-chart-v2 to generate the chart. (though I don't think it matters, but it limits my ability to pass variables as I'm not using the embed or object tag directly).

<script type="text/javascript">
swfobject.embedSWF("/ofc-library/open-flash-chart.swf", "chart", "100%", "100%", "9.0.0", "expressInstall.swf", {"wmode" : "transparent"});
</script>

Page showing problem (This doesn't currently show the z-index attempt to fix.)

Answer

Gdeglin picture Gdeglin · Mar 30, 2009

The wmode tag has not been set correctly.

Here is the correct code:

<object width="100%" height="100%" style="visibility: visible;" id="chart" data="/ofc-library/open-flash-chart.swf" type="application/x-shockwave-flash"><param value="transparent" name="wmode"/></object>

Here is your code:

<object width="100%" height="100%" type="application/x-shockwave-flash" data="/ofc-library/open-flash-chart.swf" id="chart" style="visibility: visible;"><param name="flashvars" value="wmode=transparent"/></object>

Specifically:

<param name="flashvars" value="wmode=transparent"/>

should be:

<param value="transparent" name="wmode"/>

Here is how to do it correctly (note the empty hash before the params. wmode is a param not a flashvar):

swfobject.embedSWF("/ofc-library/open-flash-chart.swf", "chart", "100%", "100%", "9.0.0", "expressInstall.swf", {}, {"wmode" : "transparent"})