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

using menubar : problem with firefox 2.0.0.3 and 1.0.0.2

Expand Messages
  • jerome
    HEllo everyone; i have a little problem using menubar on firefox, the main bar displays but the little arrow does not appear and with place my mouse pointer
    Message 1 of 4 , Mar 26, 2007
    • 0 Attachment
      HEllo everyone;

      i have a little problem using menubar on firefox, the main bar displays but the little arrow does not appear and with place my mouse pointer above the menubaritem it get colored but the submenu won't display.
      But this process works fine with Internet Explorer 6

      Here is my Code :

      <html>
      <head>
      <!-- CSS -->
      <link rel="stylesheet" type="text/css" href="../lib/yui/fonts/fonts.css">
      <link rel="stylesheet" type="text/css" href="../lib/yui/menu/assets/menu.css">

      <script type="text/javascript" src="../lib/yui/yahoo/yahoo.js"></script>

      <!-- Dependances -->
      <script type="text/javascript" src="../lib/yui/event/event.js"></script>
      <script type="text/javascript" src="../lib/yui/dom/dom.js"></script>

      <script type="text/javascript" src="../lib/yui/yahoo-dom-event/yahoo-dom-event.js"></script>
      <script type="text/javascript" src="../lib/yui/container/container_core.js"></script>
      <!-- classe menu -->
      <script type="text/javascript" src="../lib/yui/menu/menu.js"></script>
      <!-- Initialisation du menu -->
      <script type="text/javascript" language="javascript">

      //var oMenuBar = new YAHOO.widget.MenuBar("menuPrincipal");


      YAHOO.example.onMenuBarReady = function(p_oEvent) {

                      // Instantiate and render the menu bar

                      var oMenuBar = new YAHOO.widget.MenuBar("menuPrincipal", { autosubmenudisplay:true, hidedelay:750, lazyload:false });

                      oMenuBar.render();

                  }


                  // Initialize and render the menu bar when it is available in the DOM

                  YAHOO.util.Event.onContentReady("menuPrincipal", YAHOO.example.onMenuBarReady);

      </script>
      </head>
      <body>
      <div id="menuPrincipal" class="yuimenubar">
          <div class="bd">
              <ul class="first-of-type">
                  <li class="yuimenubaritem first-of-type">Gestion des fichiers</li>
                  <div id="fichiers" class="yuimenu">
                      <div class="bd">
                          <ul>
                              <li class="yuimenuitem">Cliniques</li>
                              <li class="yuimenuitem">Produits</li>
                              <li class="yuimenuitem">Nomenclatures</li>
                              <li class="yuimenuitem">Rendus</li>
                              <li class="yuimenuitem">Qualificatifs</li>
                              <li class="yuimenuitem">Factures</li>
                          </ul>
                      </div>
                  </div>
              </ul>
          </div>
      </div>
      </body>
      </html>

      I don't really understand what causes this problem
    • Todd Kloots
      Your Menu markup is wrong. Should be:
      Message 2 of 4 , Mar 26, 2007
      • 0 Attachment
        Your Menu markup is wrong.  Should be:

        <div id="menuPrincipal" class="yuimenubar">
            <div class="bd">
                <ul class="first-of-type">
                    <li class="yuimenubaritem first-of-type">Gestion des fichiers
                        <div id="fichiers" class="yuimenu">
                            <div class="bd">
                                <ul>
                                  <li class="yuimenuitem">Cliniques</li>
                                    <li class="yuimenuitem">Produits</li>
                                    <li class="yuimenuitem">Nomenclatures</li>
                                    <li class="yuimenuitem">Rendus</li>
                                    <li class="yuimenuitem">Qualificatifs</li>
                                    <li class="yuimenuitem">Factures</li>
                                </ul>
                            </div>
                        </div>           
                    </li>
                </ul>
            </div>
        </div>

        - Todd

        ----- Original Message ----
        From: jerome <jeromekbe@...>
        To: ydn-javascript@yahoogroups.com
        Sent: Monday, March 26, 2007 5:17:18 AM
        Subject: [ydn-javascript] using menubar : problem with firefox 2.0.0.3 and 1.0.0.2

        HEllo everyone;

        i have a little problem using menubar on firefox, the main bar displays but the little arrow does not appear and with place my mouse pointer above the menubaritem it get colored but the submenu won't display.
        But this process works fine with Internet Explorer 6

        Here is my Code :

        <html>
        <head>
        <!-- CSS -->
        <link rel="stylesheet" type="text/css" href="../lib/yui/fonts/fonts.css">
        <link rel="stylesheet" type="text/css" href="../lib/yui/menu/assets/menu.css">

        <script type="text/javascript" src="../lib/yui/yahoo/yahoo.js"></script>

        <!-- Dependances -->
        <script type="text/javascript" src="../lib/yui/event/event.js"></script>
        <script type="text/javascript" src="../lib/yui/dom/dom.js"></script>

        <script type="text/javascript" src="../lib/yui/yahoo-dom-event/yaho! o-dom-event.js"></script>
        <script type="text/javascript" src="../lib/yui/container/container_core.js"></script>
        <!-- classe menu -->
        <script type="text/javascript" src="../lib/yui/menu/menu.js"></script>
        <!-- Initialisation du menu -->
        <script type="text/javascript" language="javascript">

        //var oMenuBar = new YAHOO.widget.MenuBar("menuPrincipal");


        YAHOO.example.onMenuBarReady = function(p_oEvent) {

                        // Instantiate and render the menu bar

                        var oMenuBar = new YAHOO.widget.MenuBar("menuPrincipal", { autosubmenudisplay:true, hidedelay:750, lazyload:false });

                        oMenuBar.render();

            &! nbsp;       }


          &nb sp;         // Initialize and render the menu bar when it is available in the DOM

                    YAHOO.util.Event.onContentReady("menuPrincipal", YAHOO.example.onMenuBarReady);

        </script>
        </head>
        <body>
        <div id="menuPrincipal" class="yuimenubar">
            <div class="bd">
                <ul class="first-of-type">
                    <li class="yuimenubaritem first-of-type">Gestion des fichiers</li>
                    <div id="fichiers" class="yuimenu">
                        <div class="bd">
                            <ul>
              ! ;                  <li class="yuimenuitem">Cliniques</li>
                                <li class="yuimenuitem">Produits</li>
                                <li class="yuimenuitem">Nomenclatures</li>
                                <li class="yuimenuitem">Rendus</li>
                                <li class="yuimenuitem">Qualificatifs</li>
                                <li class="yuimenuitem">Factures</li>
         &! nbsp;              & nbsp;   </ul>
                        </div>
                    </div>
                </ul>
            </div>
        </div>
        </body>
        </html>

        I don't really understand what causes this problem

      • jerome
        Thank you Todd, my bad i didn t saw that ^^ . i juste noticed now a little display issue, in firefox, the first menu of the menu bar is not alligned with the
        Message 3 of 4 , Mar 26, 2007
        • 0 Attachment
          Thank you Todd, my bad i didn't saw that ^^'.

          i juste noticed now a little display issue, in firefox, the first menu
          of the menu bar is not alligned with the menubar, but is a bit to the
          left of the first menubarentry, but all others are right, should i
          modify CSS for firefox?

          thanks for your help


          --- In ydn-javascript@yahoogroups.com, Todd Kloots <kloots@...> wrote:
          >
          > Your Menu markup is wrong. Should be:
          >
          > <div id="menuPrincipal" class="yuimenubar">
          > <div class="bd">
          > <ul class="first-of-type">
          > <li class="yuimenubaritem first-of-type">Gestion des
          fichiers
          > <div id="fichiers" class="yuimenu">
          > <div class="bd">
          > <ul>
          > <li class="yuimenuitem">Cliniques</li>
          > <li class="yuimenuitem">Produits</li>
          > <li class="yuimenuitem">Nomenclatures</li>
          > <li class="yuimenuitem">Rendus</li>
          > <li class="yuimenuitem">Qualificatifs</li>
          > <li class="yuimenuitem">Factures</li>
          > </ul>
          > </div>
          > </div>
          > </li>
          > </ul>
          > </div>
          > </div>
          >
          > - Todd
          >
          > ----- Original Message ----
          > From: jerome <jeromekbe@...>
          > To: ydn-javascript@yahoogroups.com
          > Sent: Monday, March 26, 2007 5:17:18 AM
          > Subject: [ydn-javascript] using menubar : problem with firefox
          2.0.0.3 and 1.0.0.2
          >
          >
          >
          >
          > HEllo everyone;
          >
          > i have a little problem using menubar on firefox, the main bar
          displays but the little arrow does not appear and with place my mouse
          pointer above the menubaritem it get colored but the submenu won't
          display.
          > But this process works fine with Internet Explorer 6
          >
          > Here is my Code :
          >
          > <html>
          > <head>
          > <!-- CSS -->
          > <link rel="stylesheet" type="text/css"
          href="../lib/yui/fonts/fonts.css">
          > <link rel="stylesheet" type="text/css"
          href="../lib/yui/menu/assets/menu.css">
          >
          > <script type="text/javascript" src="../lib/yui/yahoo/yahoo.js"></script>
          >
          > <!-- Dependances -->
          > <script type="text/javascript" src="../lib/yui/event/event.js"></script>
          > <script type="text/javascript" src="../lib/yui/dom/dom.js"></script>
          >
          > <script type="text/javascript" src="../lib/yui/yahoo-dom-event/yaho!
          > o-dom-event.js"></script>
          > <script type="text/javascript"
          src="../lib/yui/container/container_core.js"></script>
          > <!-- classe menu -->
          > <script type="text/javascript" src="../lib/yui/menu/menu.js"></script>
          > <!-- Initialisation du menu -->
          > <script type="text/javascript" language="javascript">
          >
          > //var oMenuBar = new YAHOO.widget.MenuBar("menuPrincipal");
          >
          >
          > YAHOO.example.onMenuBarReady = function(p_oEvent) {
          >
          > // Instantiate and render the menu bar
          >
          > var oMenuBar = new
          YAHOO.widget.MenuBar("menuPrincipal", { autosubmenudisplay:true,
          hidedelay:750, lazyload:false });
          >
          > oMenuBar.render();
          >
          > &!
          > nbsp; }
          >
          >
          > &nb
          > sp; // Initialize and render the menu bar when it is
          available in the DOM
          >
          > YAHOO.util.Event.onContentReady("menuPrincipal",
          YAHOO.example.onMenuBarReady);
          >
          > </script>
          > </head>
          > <body>
          > <div id="menuPrincipal" class="yuimenubar">
          > <div class="bd">
          > <ul class="first-of-type">
          > <li class="yuimenubaritem first-of-type">Gestion des
          fichiers</li>
          > <div id="fichiers" class="yuimenu">
          > <div class="bd">
          > <ul>
          > !
          > ; <li class="yuimenuitem">Cliniques</li>
          > <li class="yuimenuitem">Produits</li>
          > <li class="yuimenuitem">Nomenclatures</li>
          > <li class="yuimenuitem">Rendus</li>
          > <li class="yuimenuitem">Qualificatifs</li>
          > <li class="yuimenuitem">Factures</li>
          > &!
          > nbsp; &
          > nbsp; </ul>
          > </div>
          > </div>
          > </ul>
          > </div>
          > </div>
          > </body>
          > </html>
          >
          > I don't really understand what causes this problem
          >
        • jerome
          i modified a line in menu.css now in the class : div.yuimenubar li.yuimenubaritem i ve changed margin:0; to margin:2; and it seems to work, and this doesn t
          Message 4 of 4 , Mar 26, 2007
          • 0 Attachment
            i modified a line in menu.css now in the class :

            div.yuimenubar li.yuimenubaritem

            i've changed margin:0; to margin:2; and it seems to work, and this
            doesn't modify the behavior in IE 6 as IE 6 was displaying the first
            menu of the menubar with the right alignment



            --- In ydn-javascript@yahoogroups.com, "jerome" <jeromekbe@...> wrote:
            >
            > Thank you Todd, my bad i didn't saw that ^^'.
            >
            > i juste noticed now a little display issue, in firefox, the first menu
            > of the menu bar is not alligned with the menubar, but is a bit to the
            > left of the first menubarentry, but all others are right, should i
            > modify CSS for firefox?
            >
            > thanks for your help
            >
            >
            > --- In ydn-javascript@yahoogroups.com, Todd Kloots <kloots@> wrote:
            > >
            > > Your Menu markup is wrong. Should be:
            > >
            > > <div id="menuPrincipal" class="yuimenubar">
            > > <div class="bd">
            > > <ul class="first-of-type">
            > > <li class="yuimenubaritem first-of-type">Gestion des
            > fichiers
            > > <div id="fichiers" class="yuimenu">
            > > <div class="bd">
            > > <ul>
            > > <li class="yuimenuitem">Cliniques</li>
            > > <li class="yuimenuitem">Produits</li>
            > > <li class="yuimenuitem">Nomenclatures</li>
            > > <li class="yuimenuitem">Rendus</li>
            > > <li class="yuimenuitem">Qualificatifs</li>
            > > <li class="yuimenuitem">Factures</li>
            > > </ul>
            > > </div>
            > > </div>
            > > </li>
            > > </ul>
            > > </div>
            > > </div>
            > >
            > > - Todd
            > >
            > > ----- Original Message ----
            > > From: jerome <jeromekbe@>
            > > To: ydn-javascript@yahoogroups.com
            > > Sent: Monday, March 26, 2007 5:17:18 AM
            > > Subject: [ydn-javascript] using menubar : problem with firefox
            > 2.0.0.3 and 1.0.0.2
            > >
            > >
            > >
            > >
            > > HEllo everyone;
            > >
            > > i have a little problem using menubar on firefox, the main bar
            > displays but the little arrow does not appear and with place my mouse
            > pointer above the menubaritem it get colored but the submenu won't
            > display.
            > > But this process works fine with Internet Explorer 6
            > >
            > > Here is my Code :
            > >
            > > <html>
            > > <head>
            > > <!-- CSS -->
            > > <link rel="stylesheet" type="text/css"
            > href="../lib/yui/fonts/fonts.css">
            > > <link rel="stylesheet" type="text/css"
            > href="../lib/yui/menu/assets/menu.css">
            > >
            > > <script type="text/javascript"
            src="../lib/yui/yahoo/yahoo.js"></script>
            > >
            > > <!-- Dependances -->
            > > <script type="text/javascript"
            src="../lib/yui/event/event.js"></script>
            > > <script type="text/javascript" src="../lib/yui/dom/dom.js"></script>
            > >
            > > <script type="text/javascript" src="../lib/yui/yahoo-dom-event/yaho!
            > > o-dom-event.js"></script>
            > > <script type="text/javascript"
            > src="../lib/yui/container/container_core.js"></script>
            > > <!-- classe menu -->
            > > <script type="text/javascript" src="../lib/yui/menu/menu.js"></script>
            > > <!-- Initialisation du menu -->
            > > <script type="text/javascript" language="javascript">
            > >
            > > //var oMenuBar = new YAHOO.widget.MenuBar("menuPrincipal");
            > >
            > >
            > > YAHOO.example.onMenuBarReady = function(p_oEvent) {
            > >
            > > // Instantiate and render the menu bar
            > >
            > > var oMenuBar = new
            > YAHOO.widget.MenuBar("menuPrincipal", { autosubmenudisplay:true,
            > hidedelay:750, lazyload:false });
            > >
            > > oMenuBar.render();
            > >
            > > &!
            > > nbsp; }
            > >
            > >
            > > &nb
            > > sp; // Initialize and render the menu bar when it is
            > available in the DOM
            > >
            > > YAHOO.util.Event.onContentReady("menuPrincipal",
            > YAHOO.example.onMenuBarReady);
            > >
            > > </script>
            > > </head>
            > > <body>
            > > <div id="menuPrincipal" class="yuimenubar">
            > > <div class="bd">
            > > <ul class="first-of-type">
            > > <li class="yuimenubaritem first-of-type">Gestion des
            > fichiers</li>
            > > <div id="fichiers" class="yuimenu">
            > > <div class="bd">
            > > <ul>
            > > !
            > > ; <li class="yuimenuitem">Cliniques</li>
            > > <li class="yuimenuitem">Produits</li>
            > > <li class="yuimenuitem">Nomenclatures</li>
            > > <li class="yuimenuitem">Rendus</li>
            > > <li class="yuimenuitem">Qualificatifs</li>
            > > <li class="yuimenuitem">Factures</li>
            > > &!
            > > nbsp; &
            > > nbsp; </ul>
            > > </div>
            > > </div>
            > > </ul>
            > > </div>
            > > </div>
            > > </body>
            > > </html>
            > >
            > > I don't really understand what causes this problem
            > >
            >
          Your message has been successfully submitted and would be delivered to recipients shortly.