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

Menubar with submenu from markup

Expand Messages
  • gewuerzmuehle
    Hi all, i want to create a menu from markup similar to the top navigation of the mercedes-benz.com website.
    Message 1 of 6 , Jul 5, 2006
      Hi all,

      i want to create a menu from markup similar to the top navigation of
      the mercedes-benz.com website.
      http://www.mercedes-benz.com/content/mbcom/international/international_website/de/com/international_home.html

      In the examples i only found a menubar where the first level was
      created from markup but the second level was generated through javascript.

      Is it possible to create multilevel menubars from markup and how do i
      align the items of the submenu horizontally?

      Thanks in advance
      Jens
    • Edwart Visser
      Hi there Jens, Take a look at http://www.htmldog.com/articles/suckerfish/dropdowns/ This website explains the creation of semantic standards based dropdown
      Message 2 of 6 , Jul 5, 2006

        Hi there Jens,

         

        Take a look at http://www.htmldog.com/articles/suckerfish/dropdowns/ This website explains the creation of semantic standards based dropdown menu’s. In the mark-up the menu is made by using <ul><li>. The dropdown should be converted to display inline to show them horizontally.

         

        Just experiment with this concept and everything will become clear.

         

        Good luck,

         

        Edwart Visser

         

         


        Van: ydn-javascript@yahoogroups.com [mailto:ydn-javascript@yahoogroups.com] Namens gewuerzmuehle
        Verzonden: woensdag 5 juli 2006 18:23
        Aan: ydn-javascript@yahoogroups.com
        Onderwerp: [ydn-javascript] Menubar with submenu from markup

         

        Hi all,

        i want to create a menu from markup similar to the top navigation of
        the mercedes-benz. com website.
        http://www.mercedes -benz.com/ content/mbcom/ international/ international_ website/de/ com/internationa l_home.html

        In the examples i only found a menubar where the first level was
        created from markup but the second level was generated through javascript.

        Is it possible to create multilevel menubars from markup and how do i
        align the items of the submenu horizontally?

        Thanks in advance
        Jens

      • Christopher
        I would love to find out how to create the navigation menu on the mercedes-benz website. I was wondering if it would be possible to modify topnav under menus
        Message 3 of 6 , Jul 6, 2006
          I would love to find out how to create the navigation menu on the
          mercedes-benz website. I was wondering if it would be possible to
          modify 'topnav' under menus (in the Yahoo CSS examples)to include an
          area underneath the main menu?


          --- In ydn-javascript@yahoogroups.com, "Edwart Visser" <e.visser@...>
          wrote:
          >
          > Hi there Jens,
          >
          >
          >
          > Take a look at http://www.htmldog.com/articles/suckerfish/dropdowns/
          > This website explains the creation of semantic standards based
          dropdown
          > menu's. In the mark-up the menu is made by using <ul><li>. The
          dropdown
          > should be converted to display inline to show them horizontally.
          >
          >
          >
          > Just experiment with this concept and everything will become clear.
          >
          >
          >
          > Good luck,
          >
          >
          >
          > Edwart Visser
          >
          >
          >
          >
          >
          > ________________________________
          >
          > Van: ydn-javascript@yahoogroups.com
          > [mailto:ydn-javascript@yahoogroups.com] Namens gewuerzmuehle
          > Verzonden: woensdag 5 juli 2006 18:23
          > Aan: ydn-javascript@yahoogroups.com
          > Onderwerp: [ydn-javascript] Menubar with submenu from markup
          >
          >
          >
          > Hi all,
          >
          > i want to create a menu from markup similar to the top navigation of
          > the mercedes-benz.com website.
          > http://www.mercedes-
          benz.com/content/mbcom/international/international_w
          > ebsite/de/com/international_home.html
          > <http://www.mercedes-
          benz.com/content/mbcom/international/international_
          > website/de/com/international_home.html>
          >
          > In the examples i only found a menubar where the first level was
          > created from markup but the second level was generated through
          > javascript.
          >
          > Is it possible to create multilevel menubars from markup and how do
          i
          > align the items of the submenu horizontally?
          >
          > Thanks in advance
          > Jens
          >
        • elebsbc
          Here is an example that I created that has a menubar and then submenus underneath it and its all done from markup.
          Message 4 of 6 , Jul 6, 2006
            Here is an example that I created that has a menubar and then submenus
            underneath it and its all done from markup.

            http://tehone.com/yui/examples/menu/Test1.html

            The one thing that appears to be a problem though is the performance
            of the page. I think that using markup is a nice way to create the
            menu structure, but it appears that to parse out the menus is very cpu
            intensive using the Yahoo UI Menu scripts. It appears to perform much
            better when generating the menus from pure script instead of markup.

            I'm not sure what type of menus you need, but this should at least
            help you get going.

            --- In ydn-javascript@yahoogroups.com, "Christopher" <autumnsun@...>
            wrote:
            >
            > I would love to find out how to create the navigation menu on the
            > mercedes-benz website. I was wondering if it would be possible to
            > modify 'topnav' under menus (in the Yahoo CSS examples)to include an
            > area underneath the main menu?
            >
            >
            > --- In ydn-javascript@yahoogroups.com, "Edwart Visser" <e.visser@>
            > wrote:
            > >
            > > Hi there Jens,
            > >
            > >
            > >
            > > Take a look at http://www.htmldog.com/articles/suckerfish/dropdowns/
            > > This website explains the creation of semantic standards based
            > dropdown
            > > menu's. In the mark-up the menu is made by using <ul><li>. The
            > dropdown
            > > should be converted to display inline to show them horizontally.
            > >
            > >
            > >
            > > Just experiment with this concept and everything will become clear.
            > >
            > >
            > >
            > > Good luck,
            > >
            > >
            > >
            > > Edwart Visser
            > >
            > >
            > >
            > >
            > >
            > > ________________________________
            > >
            > > Van: ydn-javascript@yahoogroups.com
            > > [mailto:ydn-javascript@yahoogroups.com] Namens gewuerzmuehle
            > > Verzonden: woensdag 5 juli 2006 18:23
            > > Aan: ydn-javascript@yahoogroups.com
            > > Onderwerp: [ydn-javascript] Menubar with submenu from markup
            > >
            > >
            > >
            > > Hi all,
            > >
            > > i want to create a menu from markup similar to the top navigation of
            > > the mercedes-benz.com website.
            > > http://www.mercedes-
            > benz.com/content/mbcom/international/international_w
            > > ebsite/de/com/international_home.html
            > > <http://www.mercedes-
            > benz.com/content/mbcom/international/international_
            > > website/de/com/international_home.html>
            > >
            > > In the examples i only found a menubar where the first level was
            > > created from markup but the second level was generated through
            > > javascript.
            > >
            > > Is it possible to create multilevel menubars from markup and how do
            > i
            > > align the items of the submenu horizontally?
            > >
            > > Thanks in advance
            > > Jens
            > >
            >
          • mentelocale
            Hello, from your example http://tehone.com/yui/examples/menu/Test1.html I ve create this menu (tested only in firefox):
            Message 5 of 6 , Jul 28, 2006
              Hello,
              from your example
              http://tehone.com/yui/examples/menu/Test1.html
              I've create this menu (tested only in firefox):
              http://www.lanart.it/clienti/garbin-rossi/02/

              but there are some problems:

              - javascript error: this.body has no properties
              Source file:
              http://www.lanart.it/clienti/garbin-rossi/02/themes/gbrs02/js/yui/menu/menu.js
              Line: 268

              - the menu doesn't hide himself when the mouse go out of it

              - if you click on the text of the menu item nothing appears, if you
              click on le left or on the right of the text, the link works.

              any idea?

              Devis_

              --- In ydn-javascript@yahoogroups.com, "elebsbc" <eleb@...> wrote:
              >
              > Here is an example that I created that has a menubar and then submenus
              > underneath it and its all done from markup.
              >
              > http://tehone.com/yui/examples/menu/Test1.html
              >
              > The one thing that appears to be a problem though is the performance
              > of the page. I think that using markup is a nice way to create the
              > menu structure, but it appears that to parse out the menus is very cpu
              > intensive using the Yahoo UI Menu scripts. It appears to perform much
              > better when generating the menus from pure script instead of markup.
              >
              > I'm not sure what type of menus you need, but this should at least
              > help you get going.
              >
              > --- In ydn-javascript@yahoogroups.com, "Christopher" <autumnsun@>
              > wrote:
              > >
              > > I would love to find out how to create the navigation menu on the
              > > mercedes-benz website. I was wondering if it would be possible to
              > > modify 'topnav' under menus (in the Yahoo CSS examples)to include an
              > > area underneath the main menu?
              > >
              > >
              > > --- In ydn-javascript@yahoogroups.com, "Edwart Visser" <e.visser@>
              > > wrote:
              > > >
              > > > Hi there Jens,
              > > >
              > > >
              > > >
              > > > Take a look at http://www.htmldog.com/articles/suckerfish/dropdowns/
              > > > This website explains the creation of semantic standards based
              > > dropdown
              > > > menu's. In the mark-up the menu is made by using <ul><li>. The
              > > dropdown
              > > > should be converted to display inline to show them horizontally.
              > > >
              > > >
              > > >
              > > > Just experiment with this concept and everything will become clear.
              > > >
              > > >
              > > >
              > > > Good luck,
              > > >
              > > >
              > > >
              > > > Edwart Visser
              > > >
              > > >
              > > >
              > > >
              > > >
              > > > ________________________________
              > > >
              > > > Van: ydn-javascript@yahoogroups.com
              > > > [mailto:ydn-javascript@yahoogroups.com] Namens gewuerzmuehle
              > > > Verzonden: woensdag 5 juli 2006 18:23
              > > > Aan: ydn-javascript@yahoogroups.com
              > > > Onderwerp: [ydn-javascript] Menubar with submenu from markup
              > > >
              > > >
              > > >
              > > > Hi all,
              > > >
              > > > i want to create a menu from markup similar to the top navigation of
              > > > the mercedes-benz.com website.
              > > > http://www.mercedes-
              > > benz.com/content/mbcom/international/international_w
              > > > ebsite/de/com/international_home.html
              > > > <http://www.mercedes-
              > > benz.com/content/mbcom/international/international_
              > > > website/de/com/international_home.html>
              > > >
              > > > In the examples i only found a menubar where the first level was
              > > > created from markup but the second level was generated through
              > > > javascript.
              > > >
              > > > Is it possible to create multilevel menubars from markup and how do
              > > i
              > > > align the items of the submenu horizontally?
              > > >
              > > > Thanks in advance
              > > > Jens
              > > >
              > >
              >
            • Todd Kloots
              Devis - Sorry for the late response to your email. I think that the problem lies in the example that you based your implementation on
              Message 6 of 6 , Aug 2, 2006
                Devis -

                Sorry for the late response to your email. I think
                that the problem lies in the example that you based
                your implementation on
                (http://tehone.com/yui/examples/menu/Test1.html).

                I've created an example for you based on the "topnav"
                example that ships with Menu:

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

                I think that the JavaScript error ("this.body has no
                properties") that you are experiencing is rooted in
                malformed markup. If you follow the structure
                outlined in my example you should be ok.

                If you want a Menu to hide when you click on another
                DOM element:

                1) Register each Menu instance with an instance of
                OverlayManager (YAHOO.widget.OverlayManager)

                2) Create a "click" event handler for the document
                object that calls the "hideAll" method of your
                OverlayManager instance.

                This technique is demonstrated in the example file
                that I created for you.

                Lastly, regarding your inability to click on the text
                of a MenuItem instance: This is a known bug and a fix
                has already been provided
                (http://groups.yahoo.com/group/ydn-javascript/message/3247).
                The example file that I created for you applies this
                fix.

                Hope that helps you with your project.

                - Todd

                --- mentelocale <batdevis@...> wrote:

                > Hello,
                > from your example
                > http://tehone.com/yui/examples/menu/Test1.html
                > I've create this menu (tested only in firefox):
                > http://www.lanart.it/clienti/garbin-rossi/02/
                >
                > but there are some problems:
                >
                > - javascript error: this.body has no properties
                > Source file:
                >
                http://www.lanart.it/clienti/garbin-rossi/02/themes/gbrs02/js/yui/menu/menu.js
                > Line: 268
                >
                > - the menu doesn't hide himself when the mouse go
                > out of it
                >
                > - if you click on the text of the menu item nothing
                > appears, if you
                > click on le left or on the right of the text, the
                > link works.
                >
                > any idea?
                >
                > Devis_
                >
                > --- In ydn-javascript@yahoogroups.com, "elebsbc"
                > <eleb@...> wrote:
                > >
                > > Here is an example that I created that has a
                > menubar and then submenus
                > > underneath it and its all done from markup.
                > >
                > > http://tehone.com/yui/examples/menu/Test1.html
                > >
                > > The one thing that appears to be a problem though
                > is the performance
                > > of the page. I think that using markup is a nice
                > way to create the
                > > menu structure, but it appears that to parse out
                > the menus is very cpu
                > > intensive using the Yahoo UI Menu scripts. It
                > appears to perform much
                > > better when generating the menus from pure script
                > instead of markup.
                > >
                > > I'm not sure what type of menus you need, but this
                > should at least
                > > help you get going.
                > >
                > > --- In ydn-javascript@yahoogroups.com,
                > "Christopher" <autumnsun@>
                > > wrote:
                > > >
                > > > I would love to find out how to create the
                > navigation menu on the
                > > > mercedes-benz website. I was wondering if it
                > would be possible to
                > > > modify 'topnav' under menus (in the Yahoo CSS
                > examples)to include an
                > > > area underneath the main menu?
                > > >
                > > >
                > > > --- In ydn-javascript@yahoogroups.com, "Edwart
                > Visser" <e.visser@>
                > > > wrote:
                > > > >
                > > > > Hi there Jens,
                > > > >
                > > > >
                > > > >
                > > > > Take a look at
                >
                http://www.htmldog.com/articles/suckerfish/dropdowns/
                > > > > This website explains the creation of semantic
                > standards based
                > > > dropdown
                > > > > menu's. In the mark-up the menu is made by
                > using <ul><li>. The
                > > > dropdown
                > > > > should be converted to display inline to show
                > them horizontally.
                > > > >
                > > > >
                > > > >
                > > > > Just experiment with this concept and
                > everything will become clear.
                > > > >
                > > > >
                > > > >
                > > > > Good luck,
                > > > >
                > > > >
                > > > >
                > > > > Edwart Visser
                > > > >
                > > > >
                > > > >
                > > > >
                > > > >
                > > > > ________________________________
                > > > >
                > > > > Van: ydn-javascript@yahoogroups.com
                > > > > [mailto:ydn-javascript@yahoogroups.com] Namens
                > gewuerzmuehle
                > > > > Verzonden: woensdag 5 juli 2006 18:23
                > > > > Aan: ydn-javascript@yahoogroups.com
                > > > > Onderwerp: [ydn-javascript] Menubar with
                > submenu from markup
                > > > >
                > > > >
                > > > >
                > > > > Hi all,
                > > > >
                > > > > i want to create a menu from markup similar to
                > the top navigation of
                > > > > the mercedes-benz.com website.
                > > > > http://www.mercedes-
                > > >
                > benz.com/content/mbcom/international/international_w
                > > > > ebsite/de/com/international_home.html
                > > > > <http://www.mercedes-
                > > >
                > benz.com/content/mbcom/international/international_
                > > > > website/de/com/international_home.html>
                > > > >
                > > > > In the examples i only found a menubar where
                > the first level was
                > > > > created from markup but the second level was
                > generated through
                > > > > javascript.
                > > > >
                > > > > Is it possible to create multilevel menubars
                > from markup and how do
                > > > i
                > > > > align the items of the submenu horizontally?
                > > > >
                > > > > Thanks in advance
                > > > > Jens
                > > > >
                > > >
                > >
                >
                >
                >
                >
                >
                >
                >
                >
                > Yahoo! Groups Links
                >
                >
                > ydn-javascript-unsubscribe@yahoogroups.com
                >
                >
                >
                >
                >
                >
                >
              Your message has been successfully submitted and would be delivered to recipients shortly.