sliding menu - code tweaking help!
hi all, new to both this forum and jquery in general. here is my problem:
a very generous user at
another forum donated his code to the community to make a sliding vertical menu using jquery. you can see his menu in action here:
http://www.elarcadenoe.es/
his code for the menu is here:
-
$(document).ready(function()
{
// First we hide all exhibitis
$("#menu ul li.section-title").nextAll().hide();
// then the active exhibit is showed
$("#menu ul").each(function(){
$(this).find("li.active").prevAll().nextAll().show();
});
//This is the toggle function
$("#menu ul li.section-title").click(function(){
$(this).nextAll().slideToggle("fast");
});
});
it works quite well, however you notice as you click around his menu, it does not close sections as you open new ones, so you get a somewhat jerky feel when you click on a sublink to go into a project, all the menus abruptly close.
i am trying to figure out a way to have it so that (for example) if 'print' is open, clicking on 'screen' slides open 'screen' and slides closed 'print' at the same time.
i have been futzing with the code and i found that adding this last line:
-
$(document).ready(function()
{
// First we hide all exhibitis
$("#menu ul li.section-title").nextAll().hide();
// then the active exhibit is showed
$("#menu ul").each(function(){
$(this).find("li.active").prevAll().nextAll().show();
});
//This is the toggle function
$("#menu ul li.section-title").click(function(){
$(this).nextAll().slideToggle("fast");
$("#menu ul li.section-title").nextAll().hide();
});
});
does close the open sections but does it very jerkily. since i am positive i am doing this tottally wrong, can someone please let me know what the correct line(s) of code would be to get the effect i want. i am not a developer, etc... so i am really just trying to make this work
you can see my menu here:
http://www.typeconstruct.com/
thanks much in advance!