Tony Roman
asked on
How to maintain the position of the current clicked tab while navigating to a new page using a vertical accordion menu
The website is using a vertical accordion menu which works great, but resets to its' initial position each time (if expanded) while going to a new page. This can be very annoying for a visitor who has to start browsing through a lot of sub-menus, to expand it back exactly where it was. There are a lot of pages/links nested in the menu and I am planning to add even more, so the accordion should stay open. It should close back up only when and if the visitor chooses to, but I'm not sure how to accomplish that, because I'm not very familiar with these scripts.
Please take a look at the scripts pasted below and let me know if you have any suggestions.
Thank you.
$(document).ready(function (){
$("#accordian a").click(function(){
var link = $(this);
var closest_ul = link.closest("ul");
var parallel_active_links = closest_ul.find(".active")
var closest_li = link.closest("li");
var link_status = closest_li.hasClass("activ e");
var count = 0;
closest_ul.find("ul").slid eUp(functi on(){
if(++count == closest_ul.find("ul").leng th)
parallel_active_links.remo veClass("a ctive");
});
if(!link_status)
{
closest_li.children("ul"). slideDown( );
closest_li.addClass("activ e");
}
})
})
and
$(document).ready(function (){
$("#accordian h3").click(function(){
//slide up all the link lists
$("#accordian ul ul").slideUp();
//slide down the link list below the h3 clicked - only if its closed
if(!$(this).next().is(":ac tive"))
{
$(this).next().slideDown() ;
}
})
})
Please take a look at the scripts pasted below and let me know if you have any suggestions.
Thank you.
$(document).ready(function
$("#accordian a").click(function(){
var link = $(this);
var closest_ul = link.closest("ul");
var parallel_active_links = closest_ul.find(".active")
var closest_li = link.closest("li");
var link_status = closest_li.hasClass("activ
var count = 0;
closest_ul.find("ul").slid
if(++count == closest_ul.find("ul").leng
parallel_active_links.remo
});
if(!link_status)
{
closest_li.children("ul").
closest_li.addClass("activ
}
})
})
and
$(document).ready(function
$("#accordian h3").click(function(){
//slide up all the link lists
$("#accordian ul ul").slideUp();
//slide down the link list below the h3 clicked - only if its closed
if(!$(this).next().is(":ac
{
$(this).next().slideDown()
}
})
})
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
first set X as 1/2/3 etc and make it works...
then change that X based on your page...
then change that X based on your page...
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thank you so much. I'll try it.
different solutions are provided...
ASKER