Loading ...
Sorry, an error occurred while loading the content.

Menu Overlay not working in Firefox

Expand Messages
  • yuidev2006
    The menu s in the example file applicationmenubar.html seem to show under any content placed in the body of the document in Firefox 1.5.0.5 only. It seems to
    Message 1 of 3 , Jul 31, 2006
    • 0 Attachment
      The menu's in the example file applicationmenubar.html seem to show
      under any content placed in the body of the document in Firefox
      1.5.0.5 only. It seems to work correctly in both IE and Safari.

      To demonstrate this I added the following to the body of the document

      <div id="blah" style="position:absolute; top:100px; width:300px;
      z-index:0; background-color:red;">Line 1<br>Line 2</div>

      In Firefox 1.5.0.5, when you click on the File or Edit button, the
      menu appears below the red div.

      This works correctly in IE and Safari.

      Is this a know issue?
    • Todd Kloots
      Thanks for reporting this one. It appears to be a bug in FF 1.5 only. I tested this in FF 1.0.x and it works correctly. The source of the problem appears to
      Message 2 of 3 , Aug 1 2:13 PM
      • 0 Attachment
        Thanks for reporting this one. It appears to be a bug
        in FF 1.5 only. I tested this in FF 1.0.x and it
        works correctly.

        The source of the problem appears to be MenuBar's use
        of "overflow:hidden." It seems static elements with
        their overflow set to "hidden" prevent their
        positioned children from properly overlaying other
        elements on the page in FF 1.5.

        You can add this style declaration to your page to fix
        the bug:

        div.yuimenubar ul {

        overflow:visible;

        }

        Here is a test page demonstrating the fix:

        http://yuiblog.com/sandbox/yui/v011/examples/menu/example08.php

        - Todd


        --- yuidev2006 <amosson@...> wrote:

        > The menu's in the example file
        > applicationmenubar.html seem to show
        > under any content placed in the body of the document
        > in Firefox
        > 1.5.0.5 only. It seems to work correctly in both IE
        > and Safari.
        >
        > To demonstrate this I added the following to the
        > body of the document
        >
        > <div id="blah" style="position:absolute; top:100px;
        > width:300px;
        > z-index:0; background-color:red;">Line 1<br>Line
        > 2</div>
        >
        > In Firefox 1.5.0.5, when you click on the File or
        > Edit button, the
        > menu appears below the red div.
        >
        > This works correctly in IE and Safari.
        >
        > Is this a know issue?
        >
        >
        >
        >
        >
        >
        >
        > Yahoo! Groups Links
        >
        >
        > ydn-javascript-unsubscribe@yahoogroups.com
        >
        >
        >
        >
        >
        >
        >
      • yuidev2006
        I tested the fix in my code and it works like a charm. Thanks
        Message 3 of 3 , Aug 1 4:05 PM
        • 0 Attachment
          I tested the fix in my code and it works like a charm.

          Thanks

          --- In ydn-javascript@yahoogroups.com, Todd Kloots <kloots@...> wrote:
          >
          > Thanks for reporting this one. It appears to be a bug
          > in FF 1.5 only. I tested this in FF 1.0.x and it
          > works correctly.
          >
          > The source of the problem appears to be MenuBar's use
          > of "overflow:hidden." It seems static elements with
          > their overflow set to "hidden" prevent their
          > positioned children from properly overlaying other
          > elements on the page in FF 1.5.
          >
          > You can add this style declaration to your page to fix
          > the bug:
          >
          > div.yuimenubar ul {
          >
          > overflow:visible;
          >
          > }
          >
          > Here is a test page demonstrating the fix:
          >
          > http://yuiblog.com/sandbox/yui/v011/examples/menu/example08.php
          >
          > - Todd
          >
          >
          > --- yuidev2006 <amosson@...> wrote:
          >
          > > The menu's in the example file
          > > applicationmenubar.html seem to show
          > > under any content placed in the body of the document
          > > in Firefox
          > > 1.5.0.5 only. It seems to work correctly in both IE
          > > and Safari.
          > >
          > > To demonstrate this I added the following to the
          > > body of the document
          > >
          > > <div id="blah" style="position:absolute; top:100px;
          > > width:300px;
          > > z-index:0; background-color:red;">Line 1<br>Line
          > > 2</div>
          > >
          > > In Firefox 1.5.0.5, when you click on the File or
          > > Edit button, the
          > > menu appears below the red div.
          > >
          > > This works correctly in IE and Safari.
          > >
          > > Is this a know issue?
          > >
          > >
          > >
          > >
          > >
          > >
          > >
          > > Yahoo! Groups Links
          > >
          > >
          > > ydn-javascript-unsubscribe@yahoogroups.com
          > >
          > >
          > >
          > >
          > >
          > >
          > >
          >
        Your message has been successfully submitted and would be delivered to recipients shortly.