Member Avatar for jpmad4it

Hello everyone,

I have built a DHTML & Javascript menu using the Deluxe Menu (www.deluxe-menu.com) software package.

The problem is that in IE7 the menu works fine, yet in Firefox it is displayed behind everything.

If you look here using IE and Firefox you can see the difference when you drop down the 'services' box in the menu:

www.boxroom-media.com/test/johnny3

I tried to resolve this by using CSS. I set the 2 classes 'flash' and 'menu', and I then set the Flash z-index to -1 and the menu z-index to 1 ( I also set the positioning for both of these to absolute). This didnt work

So I then tried to edit the Javascript file that controls the menu. This has all the variables that are needed for the menu. In the script I added the following under the positoning section:

var zIndex="1";

I also kept the flash z-index to -1, but again this didnt work!

Finally, i tried to add a javascript function directly into the code to try and change the z-index of the menu when the page loaded up. I used the following code:

<script type="text/javascript">
function changeStackOrder()
{
document.getElementById("menu").style.zIndex="1";
}
</script>

I then set the function to execute on the load of the body:

<body onLoad="changeStackOrder()">

I also made sure the ID of the menu was set to 'menu' so that the function executed on the menu. Again this didnt work.

Can anyone help me out? Is it just a problem with Firefox and that it can't handle the z-index property?

Any help would be greatly appreciated.

regards,
Jp

  • 3 Contributors
  • 4 Replies
  • 348 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by jpmad4it

Recommended Answers

All 4 Replies

Member Avatar for hollystyles

try adding <param name="wmode" value="transparent"> into this section:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="1000" height="200" title="intro">
      <param name="movie" value="Flash/intro.swf">
      <param name="quality" value="high">
      <embed src="Flash/intro.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="1000" height="200" ></embed>
    </object>
Member Avatar for jpmad4it

try adding <param name="wmode" value="transparent"> into this section:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="1000" height="200" title="intro">
      <param name="movie" value="Flash/intro.swf">
      <param name="quality" value="high">
      <embed src="Flash/intro.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="1000" height="200" ></embed>
    </object>

hey thanks, but it didnt work :sad:

Member Avatar for DanceInstructor

You have not declared a doctype for this page. This leaves each browser to decide how it will render the page (quirks mode) vs following standards (standards mode). Declaring a doctype may make FF start paying attention to your z-index declarations. Doctypes: http://www.w3schools.com/tags/tag_doctype.asp

I think this menu will be bad for SEO as most search engines probably wont be able to see the links in the menu. Also by using this menu you FORCE your viewers/users to enable javascript to browse the site. IMO you should try something else.

I have used and like FreeStyle Menus, you can find it here: http://www.twinhelix.com/dhtml/fsmenu/
FreeStyle Menus use javascript, but degrade gracefully if javascript isnt available. The actual links to your pages are on the page on document load as well, so search engines will be able to see other pages on your site.

Member Avatar for jpmad4it

hey thanks, but it didnt work :sad:

I had to add it to both the embed and object elements - it now works :cheesy:

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.