Results 1 to 4 of 4
  1. #1
    Join Date
    Apr 2008
    Posts
    73

    javascript dropdown problem IE6 and 7

    Hello javascript folks,

    PROBLEM: javascript dropdown problem:
    DESCRIPTION: menu falls behind a container box on web page
    COMMENTS: It works fine in Firefox but not in IE6 and IE7


    Notice this URL using IE6/7:

    http://iimaaconference.com.yourtemps...onference.html

    You'll see a javascript scrollbar container box, holding the main content. You will also see a javascript
    horizontal menu -- starting with "Home" / "About the Conference" / "The Venue" and so on.

    Now, go ahead and mouse over on "About the Conference" and others. See how the drop down menu falls behind
    the main content container box? The menu is not readable, then menu should be on top of page content, not
    hidden behind.

    The javascript drop down menu works perfectly fine over static HTML, visit the URL below to see how the
    menu should look:

    http://iimaaconference.com.yourtempsite.com/site/

    Additional Notes: One developer mentioned there is a compatibilty problem with IE6/7 and overlapping javascript
    menu with scroll box. The developer did some research, mentioning to eleminate the javascript scrollbar altogether.
    Customer wants both menu's and scroll box intact.

    OK, if anyone has ideas about how to fix this problem, please let me know.

    Best,
    Brad

  2. #2
    Join Date
    May 2009
    Posts
    766
    You're setting the z-index of the submenu to 2, and not setting the z-index on the scroll box at all. My guess is that as IE is rendering the page, it is assuming z-index values to layer the page in what it expects is the correct order. Therefore, your scroll box could have a higher z-index. Since there really should be nothing on the page that goes on top of the submenu div, I'd start by cranking the z-index up to 1000 or so.

  3. #3
    You moved the menu under the box? Normally, I find that when things are going under, it's because the z-index is incorrectly applied to an element which has not also been given absolute positioning. Remember, z-index only applies to absolutely positioned elements.

  4. #4
    Join Date
    Oct 2009
    Location
    Nottingham, UK
    Posts
    57
    this issue is caused by positioning elements absolute - in IE6/7 when you position elements absolute they generate a new stacking over so the z-index resets itself. A great guide I always refer back to on this is here: http://brenelz.com/2009/02/03/squish...r-z-index-bug/

    clearly shows you whats going on and how to fix it
    SWORDFISH HOSTING - UK Based Web Hosting - 24*7 Support
    Shared Hosting | VPS | Dedicated Servers | Plesk 9 Control Panel
    Web Hosting For Everyone

Similar Threads

  1. Javascript Problem - Dropdown Menu
    By JohnJ in forum Web Design and Content
    Replies: 3
    Last Post: 09-08-2008, 04:40 AM
  2. DHTML/Javascript Dropdown Menu
    By Bakie in forum Programming Discussion
    Replies: 4
    Last Post: 05-12-2005, 02:50 AM
  3. javascript - dropdown menu
    By Angelo in forum Programming Discussion
    Replies: 5
    Last Post: 10-13-2004, 06:53 PM
  4. Javascript dropdown menu help.
    By voidix in forum Programming Discussion
    Replies: 4
    Last Post: 08-07-2004, 09:26 PM
  5. Dropdown menus, javascript or php?
    By Suedish in forum Programming Discussion
    Replies: 5
    Last Post: 03-13-2004, 06:09 AM

Posting Permissions

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