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

RE: [ydn-javascript] Support for div inside menu

Expand Messages
  • 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 1 of 4 , Mar 30, 2007
    • 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.