How to prevent Javascript Menu from getting hidden under Flash Video (SWFObject ).

I am using Open Flash Chart and the chart is displaying fine in my php shoppping cart, but my javascript menu is getting hidden behind the Flash Chart.

How to correct this problem?

Here is my script code:

---

<script type="text/javascript">

swfobject.embedSWF(
  "open-flash-chart.swf", "Dashboard_Chart",
  "800", "400", "9.0.0", "expressInstall.swf",
  {"data-file":"ofc-chart.php"} );

</script>

---

UPDATE (Solved):

I found the solution.

Here is my new code which works and the menu shows up fine.

---

<script type="text/javascript">
    var flashvars = {};
    var params = {};
    params.wmode = "opaque";
    var attributes = {};
    swfobject.embedSWF("../swf/open-flash-chart.swf", "Dashboard_Chart", "760", "300", "9.0.0", "expressInstall.swf", {"data-file":"ofc-chart.php"}, flashvars, params, attributes );

</script>

---

How to prevent Javascript Menu from getting hidden under Flash Video (SWFObject ).

I am using Open Flash Chart and the chart is displaying fine in my php shoppping cart, but my javascript menu is getting hidden behind the Flash Chart.

How to correct this problem?

Here is my script code:

---

<script type="text/javascript">

swfobject.embedSWF(
  "open-flash-chart.swf", "Dashboard_Chart",
  "800", "400", "9.0.0", "expressInstall.swf",
  {"data-file":"ofc-chart.php"} );

</script>

---

UPDATE (Solved):

I found the solution.

Here is my new code which works and the menu shows up fine.

---

<script type="text/javascript">
    var flashvars = {};
    var params = {};
    params.wmode = "opaque";
    var attributes = {};
    swfobject.embedSWF("../swf/open-flash-chart.swf", "Dashboard_Chart", "760", "300", "9.0.0", "expressInstall.swf", {"data-file":"ofc-chart.php"}, flashvars, params, attributes );

</script>

---

• javascript
• menu
• swfobject
• open-flash-chart

Share Improve this question Follow edited Jul 4, 2009 at 9:59 Ibn Saeed asked Jul 4, 2009 at 9:20 Ibn SaeedIbn Saeed 3,2991212 gold badges5151 silver badges6060 bronze badges 9

• I'd remend you to add your solution as an answer and mark is as teh correct answer, as per SO understanding. – Paulo Santos Commented Jul 4, 2009 at 9:44
• hmm, I already marked an answer below. – Ibn Saeed Commented Jul 4, 2009 at 9:51
• @Ibn Saeed sorry for raking up the past. But I have this problem in Chrome at this moment and this solution did not work. Do you have the problem now? check jttech..hk/design.php thanks for your attention. – Jake Commented Jun 15, 2011 at 4:22
• @Jake, i have not worked on this for more than 1 year. I do not have the code for it anymore. Sorry for not being of any help – Ibn Saeed Commented Jun 15, 2011 at 10:31
• @Ibn Saeed appreciate your response very much =) I was just trying my luck in case you are still working with creating websites. Thanks! – Jake Commented Jun 15, 2011 at 11:55

 |  Show 4 more ments

2 Answers 2

Sorted by: Reset to default 3

Try setting the wmode parameter to transparent

swfobject.embedSWF("open-flash-chart.swf", "Dashboard_Chart","800", "400", "9.0.0",
   "expressInstall.swf",
   {"data-file":"ofc-chart.php"},
   {"wmode":"transparent"}
);

You need to set the wmode to opaque (or transparent). This delegates rendering to the browser and allows z-index elements to sit above the Flash content. Example:

<script type="text/javascript">
var flashvars = {};
var params = {};
params.wmode = "transparent"; 
//params.wmode = "opaque"; 
var attributes = {};
swfobject.embedSWF("myContent.swf", "myContent", "300", "120",
    "9.0.0","expressInstall.swf", flashvars, params, attributes);
</script> 

Comes with a number of disadvantages, such as broken internationalisation and slower rendering speed, but it will get the Flash under your menu.