A Flash Developer Resource Site

Results 1 to 5 of 5

Thread: Dynamic HTML menu....Z-index trouble with Firefox

  1. #1
    Junior Member
    Join Date
    Aug 2002
    Posts
    6

    Dynamic HTML menu....Z-index trouble with Firefox

    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:

    Code:
    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:

    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:

    Code:
    <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
    Last edited by jpmad4it; 03-30-2007 at 11:19 AM.

  2. #2
    Retired Mod aversion's Avatar
    Join Date
    Jun 2000
    Location
    insomnia
    Posts
    7,917
    It's the flash that's the problem, I think you'll find that if you had any other content type there it would work. In some browsers flash will push itself to the top of the stack.

    There must be something different about your implementation of the menu though, there is a page about how the menu will avoid this problem on the site you got the menu from in the first place, find it here. You can see they have it working, I suggest seeing if there's anything different with the way they've implemented the menu, or the flash of course.

    it even says on their FAQ page:
    "Q: How does Deluxe Menu works with flash, select, iframe and other objects on page? Do submenus drop down over these objects?
    A: Yes, submenus drop down over all objects of a page."

    I imagine it's something simple that you've missed or they haven't made clear.

  3. #3
    Senior Member catbert303's Avatar
    Join Date
    Aug 2001
    Location
    uk
    Posts
    11,222
    In the embed tag try adding the attribute

    wmode="transparent"

    though, I'm not sure, you may still have problems with the menu items that appear over the movie not being clickable.

  4. #4
    Junior Member
    Join Date
    Mar 2007
    Posts
    21
    I might suggest you go back to your "deluxe" website, search a little, they know about the "Firefox issue", they even posted a fix (Seamless integration -> Visible)...

  5. #5
    Junior Member
    Join Date
    Aug 2002
    Posts
    6
    Quote Originally Posted by catbert303
    In the embed tag try adding the attribute

    wmode="transparent"

    though, I'm not sure, you may still have problems with the menu items that appear over the movie not being clickable.
    Thanks, this worked

    I had to add it to both the object and embed elements!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center