Thanks Gafa, that's great - I'll try it now.
On 1 Sep, 13:47, Gafa <[email protected]> wrote: > Try this:http://mootools.net/shell/EXuCk/ -- You'll need to adapt > this to your own code. > > In your add click you are referencing menu array with your incrementor > ii, but inside the click event function it has no point of reference. > > Gafa > > On Sep 1, 6:26 am, WhyNotSmile <[email protected]> wrote: > > > Hi everyone, I'm new to mootools, and have got stuck trying to use > > Fx.slide. > > > In my navigation, there are about 10 items or so. 3 of them have > > submenus, and I am trying to implement slide so that when the top > > level item is clicked, the corresponding submenu slides down. > > > I can achieve this by explicitly applying it to each of them, like > > this: > > > window.addEvent('domready', function(){ > > > var foodMenu= new Fx.Slide('subsectionlist_thefood'); > > var wineMenu= new Fx.Slide('subsectionlist_thewine'); > > var galleryMenu= new Fx.Slide('subsectionlist_gallery'); > > > foodMenu.hide(); > > wineMenu.hide(); > > galleryMenu.hide(); > > > $('menu_thefood').addEvent('click', function(e){ > > e = new Event(e); > > foodMenu.toggle(); > > e.stop(); > > }) > > $('menu_thewine').addEvent('click', function(e){ > > e = new Event(e); > > wineMenu.toggle(); > > e.stop(); > > }); > > $('menu_gallery').addEvent('click', function(e){ > > e = new Event(e); > > galleryMenu.toggle(); > > e.stop(); > > }); > > }); > > > This works fine and looks good. > > > However, I'd like to be able to automate this, so that I don't have to > > explicitly set each one. This would mean that I could add new > > submenus without having to add the code in here each time. > > > I tried doing it like this: > > > window.addEvent('domready', function(){ > > > // Get all links which have sublinks > > var listList = document.getElementsByTagName('ul'); > > var sectionList = new Array(); > > for(var ii=0; ii< listList.length; ii++) { > > if(listList[ii].className == 'subsection') { > > sectionList.push(listList[ii]); > > } > > } > > > // Make sublinks into slides > > var menu = new Array(); > > for(ii=0; ii<sectionList.length; ii++) { > > menu[ii] = new Fx.Slide(sectionList[ii].id); > > menu[ii].hide(); > > $('menu_' + > > sectionList[ii].id.replace('subsectionlist_','')).addEvent('click', > > function(e){ > > e = new Event(e); > > menu[ii].toggle(); > > e.stop(); > > }) > > } > > }) > > > This hides them all ok, but they don't show when the top level item is > > clicked. I tried putting an alert into the toggle function in > > mootools, and it appears that toggle is not being triggered. What am > > I doing wrong? > > > Thank you.
