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

Support for div inside menu

Expand Messages
  • Berend de Boer
    Hi Yahoo, It frequently is useful to have arbitrary divs inside a menu, for example: test 1 ... test
    Message 1 of 4 , Mar 28 2:14 PM
    • 0 Attachment
      Hi Yahoo,

      It frequently is useful to have arbitrary divs inside a menu, for example:

      <div id="replacable">
      <h6>test 1</h6>
      <ul>
      <li>...</li>
      </ul>
      <h6>test 2</h6>
      <ul>
      <li>...</li>
      </ul>
      </div>

      Not only to replace portions of the menu, but also to attach an event
      handler to the div that manages a portion of the menu. But as soon as
      you put a div in the menu, it seems everything inside it is ignored.

      Is there an easy patch to menu.js to have this fixed?

      Thanks,

      Berend.
    • Berend de Boer
      Hi Yahoo, It frequently is useful to have arbitrary divs inside a menu, for example: test 1 ... test
      Message 2 of 4 , Mar 28 2:14 PM
      • 0 Attachment
        Hi Yahoo,

        It frequently is useful to have arbitrary divs inside a menu, for example:

        <div id="replacable">
        <h6>test 1</h6>
        <ul>
        <li>...</li>
        </ul>
        <h6>test 2</h6>
        <ul>
        <li>...</li>
        </ul>
        </div>

        Not only to replace portions of the menu, but also to attach an event
        handler to the div that manages a portion of the menu. But as soon as
        you put a div in the menu, it seems everything inside it is ignored.

        Is there an easy patch to menu.js to have this fixed?

        Thanks,

        Berend.
      • Berend de Boer
        Hi Yahoo, It frequently is useful to have arbitrary divs inside a menu, for example: test 1 ... test
        Message 3 of 4 , Mar 28 2:14 PM
        • 0 Attachment
          Hi Yahoo,

          It frequently is useful to have arbitrary divs inside a menu, for example:

          <div id="replacable">
          <h6>test 1</h6>
          <ul>
          <li>...</li>
          </ul>
          <h6>test 2</h6>
          <ul>
          <li>...</li>
          </ul>
          </div>

          Not only to replace portions of the menu, but also to attach an event
          handler to the div that manages a portion of the menu. But as soon as
          you put a div in the menu, it seems everything inside it is ignored.

          Is there an easy patch to menu.js to have this fixed?

          Thanks,

          Berend.
        • Mike Lee (YUI)
          Hi Berend, The Menu component wasn t originally designed for arbitrary markup within the Menu markup. If this is a highly requested feature from the community,
          Message 4 of 4 , Mar 30 4:32 PM
          • 0 Attachment
            Hi Berend,

            The Menu component wasn't originally designed for arbitrary markup
            within the Menu markup. If this is a highly requested feature from the
            community, we'll certainly consider it (and let me know if that's the
            case!).

            In the meantime, here are a few ideas that may help. Currently, the Menu
            component allows div elements within the list markup, such as:

            <div id="menu" class="yuimenubar">
            <div class="bd">
            <ul>
            <li class="yuimenubaritem"><a href="#">Item 1</a></li>
            <li class="yuimenubaritem"><a href="#">Item 2</a></li>
            <li class="yuimenubaritem"><a href="#">Item 3</a></li>
            <li class="yuimenubaritem"><a href="#">Item 4</a></li>
            </ul>
            </div>
            </div>


            Idea 1:
            How about using the parent div and climbing down the child nodes
            individually? Or, if you want easier hooks...


            Idea 2:
            How about creating a group of items in your menu? This unfortunately
            creates a visual separation in your menu.

            <div id="menu" class="yuimenubar">
            <div class="bd">
            <ul id="replace1">
            <li class="yuimenubaritem"><a href="#">Item 1</a></li>
            <li class="yuimenubaritem"><a href="#">Item 2</a></li>
            </ul>
            <ul id="replace2">
            <li class="yuimenubaritem"><a href="#">Item 3</a></li>
            <li class="yuimenubaritem"><a href="#">Item 4</a></li>
            </ul>
            </div>
            </div>


            Idea 3:
            How about creating pointers within each specific item in your menu?

            <div id="menu" class="yuimenubar">
            <div class="bd">
            <ul>
            <li id="replace1" class="yuimenubaritem"><a href="#">Item 1</a></li>
            <li id="replace2" class="yuimenubaritem"><a href="#">Item 2</a></li>
            <li class="yuimenubaritem"><a href="#">Item 3</a></li>
            <li class="yuimenubaritem"><a href="#">Item 4</a></li>
            </ul>
            </div>
            </div>


            Once you have a hook to the appropriate items, you can assign any events
            you'd like to them.

            I hope this helps!



            ________________________________

            From: ydn-javascript@yahoogroups.com
            [mailto:ydn-javascript@yahoogroups.com] On Behalf Of Berend de Boer
            Sent: Wednesday, March 28, 2007 2:15 PM
            To: ydn-javascript@yahoogroups.com
            Subject: [ydn-javascript] Support for div inside menu


            Hi Yahoo,

            It frequently is useful to have arbitrary divs inside a menu, for
            example:

            <div id="replacable">
            <h6>test 1</h6>
            <ul>
            <li>...</li>
            </ul>
            <h6>test 2</h6>
            <ul>
            <li>...</li>
            </ul>
            </div>

            Not only to replace portions of the menu, but also to attach an event
            handler to the div that manages a portion of the menu. But as soon as
            you put a div in the menu, it seems everything inside it is ignored.

            Is there an easy patch to menu.js to have this fixed?

            Thanks,

            Berend.
          Your message has been successfully submitted and would be delivered to recipients shortly.