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.)
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"})