I'm sorry, I missed the other key mistake with that code. See http://jsbin.com/iruga/ which works. The key difference is the wrapping of the UL with a div with an ID of #myContent so that when you call $("#myContent").html() you get a complete <ul> block instead of just a bunch of <li> which was the problem before.
In that demo there isn't a lot of hacking to get it working, although there is a lot of additional css styling on that page. On Thu, Dec 17, 2009 at 11:26 AM, MISS_DUKE <siva...@gmail.com> wrote: > I tested by including the jQuery script first, still I could not get > it. Firebug does not show any errors. > > I viewed the page source of the Filament group example page (at the > following URL), it seems they have done a lot of hacking to get it > worked for the moment. > http://www.filamentgroup.com/examples/menus/index.html > > On Dec 17, 7:09 pm, Nate Laws <natel...@gmail.com> wrote: > > The problem looks to be the order of your <script> includes. > > jquery-1.3.2.min.js must be included before any jquery plugins. Do you > > have firebug for firefox? If you did it would give an error like > 'function > > menu does not exist' indicating that there is something wrong with how > you > > load your js. > > > > On Thu, Dec 17, 2009 at 3:36 AM, MISS_DUKE <siva...@gmail.com> wrote: > > > I could not get this menu work for me, I could not find what the > > > problem is. (I am copying and pasting the HTML code bellow, that I > > > used to test the menu ) > > > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http:// > > >www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> > > > <html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en"> > > > > > <head> > > > <meta http-equiv="Content-Type" content="text/html; > > > charset=utf-8" /> > > > <title>Untitled Document</title> > > > <link rel="stylesheet" type="text/css" href="fg-menu/ > > > fg.menu.css" /> > > > <script type="text/javascript" src="fg-menu/fg.menu.js"></ > > > script> > > > <script type="text/javascript" src="fg-menu/ > > > jquery-1.3.2.min.js"></script> > > > </head> > > > > > <body> > > > <script type="text/javascript"> > > > $(document).ready(function(){ > > > $('#myMenuButton').menu({ > > > content: $('#myContent').html(), > > > maxHeight: 180, > > > positionOpts: { offsetX: 10, offsetY: 20 }, > > > showSpeed: 300 > > > }); > > > }); > > > </script> > > > > > <a id="myMenuButton" href="#">Click here to open options</a> > > > <ul id="myContent"> > > > <li><a href="#">Menu option</a></li> > > > <li><a href="#">Menu option</a></li> > > > <li><a href="#">Menu option</a> > > > <ul> > > > <li><a href="#">Child menu option</a></li> > > > <li><a href="#">Child menu option</a></li> > > > <li><a href="#">Child menu option</a></li> > > > </ul> > > > </li> > > > <li><a href="#">Menu option</a></li> > > > </ul> > > > > > </body> > > > </html> > > > > > On Dec 17, 1:07 am, Nate Laws <natel...@gmail.com> wrote: > > > > Its whatever you want to bind the menu to. Its what you click to > open > > > the > > > > menu. > > > > > > In their samples they use a <a> tag. So you could do something like: > > > > > > <a id="myMenuButton" href="#">Click here to open options</a> > > > > > > On Wed, Dec 16, 2009 at 11:15 AM, MISS_DUKE <siva...@gmail.com> > wrote: > > > > > I read the article about the Filament group menu at the following > URL: > > > > > > http://www.filamentgroup.com/lab/jquery_ipod_style_and_flyout_menus/ > > > > > > > The above mentioned menu, which may be the future jQuery menu > widget, > > > > > is as excellent as other jQuery widgets. > > > > > > > The above article mention the following (example) code to be used > to > > > > > create this menu: > > > > > > > $(document).ready(function(){ > > > > > $('#myMenuButton').menu({ > > > > > content: $('#myContent').html(), > > > > > maxHeight: 180, > > > > > positionOpts: { offsetX: 10, offsetY: 20 }, > > > > > showSpeed: 300 > > > > > }); > > > > > }); > > > > > > > I understand the "#myContent" is the selector of the unordered list > > > > > which is to be converted as the menu. But what is that > > > > > "#myMenuButton"? Please anyone explain with a small example. > > > > > > > -- > > > > > > > You received this message because you are subscribed to the Google > > > Groups > > > > > "jQuery UI" group. > > > > > To post to this group, send email to jquery...@googlegroups.com. > > > > > To unsubscribe from this group, send email to > > > > > jquery-ui+unsubscr...@googlegroups.com<jquery-ui%2bunsubscr...@googlegroups.com> > <jquery-ui%2bunsubscr...@googlegroups.com<jquery-ui%252bunsubscr...@googlegroups.com> > > > > > <jquery-ui%2bunsubscr...@googlegroups.com<jquery-ui%252bunsubscr...@googlegroups.com> > <jquery-ui%252bunsubscr...@googlegroups.com<jquery-ui%25252bunsubscr...@googlegroups.com> > > > > > > > > > . > > > > > For more options, visit this group at > > > > >http://groups.google.com/group/jquery-ui?hl=en. > > > > > -- > > > > > You received this message because you are subscribed to the Google > Groups > > > "jQuery UI" group. > > > To post to this group, send email to jquery...@googlegroups.com. > > > To unsubscribe from this group, send email to > > > jquery-ui+unsubscr...@googlegroups.com<jquery-ui%2bunsubscr...@googlegroups.com> > <jquery-ui%2bunsubscr...@googlegroups.com<jquery-ui%252bunsubscr...@googlegroups.com> > > > > > . > > > For more options, visit this group at > > >http://groups.google.com/group/jquery-ui?hl=en. > > -- > > You received this message because you are subscribed to the Google Groups > "jQuery UI" group. > To post to this group, send email to jquery...@googlegroups.com. > To unsubscribe from this group, send email to > jquery-ui+unsubscr...@googlegroups.com<jquery-ui%2bunsubscr...@googlegroups.com> > . > For more options, visit this group at > http://groups.google.com/group/jquery-ui?hl=en. > > > -- You received this message because you are subscribed to the Google Groups "jQuery UI" group. To post to this group, send email to jquery...@googlegroups.com. To unsubscribe from this group, send email to jquery-ui+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/jquery-ui?hl=en.
