Dynamic Page with vertical menu question - accordion?

[charissepaula]

I currently have several sites using the dynamic page tweak with horizontal menus (including drop downs)

I have a new website I have begun to design that will have a horizontal category menu. Interior pages will also require a vertical menu with submenu. There is a distinct possiblility in the future the submenus might be nested. Flyout is one option but an accordion would be less cluttered.

The main body of each page will have dynamic content (dynamic page tweak)...

Before I head down this path: my concern is if I end up with one menu with a very large accordian when open, what if the entire menu now exceeds the size of the page (dictated by the dynamic content).

Is there a way around this problem?

[charissepaula]

It appears from the lack of response there might not be a way to accomplish this or is my description of the problem unclear?

[xtom]

I just realised I'm having this same problem. I'm thinking it might be possible to use similar javascript that's in the dynamic page to adjust the page length when the accordian is expanded/collapsed.

[xtom]

OK I managed to get this working really good on the jquery accordian menu that I'm using.

$(theElement) is the part of the accordian that slides in/out so this will vary depending on the script your using. It increases/decreases the page by the height of $(theElement).

I put the follwing code in the jquery accordian menu script, the piece that expands the menu

/* start expand code for wd6 */
var xri_height = $('#xr_xri').height()+$(theElement).height();
var my_background_height = $('#my_background').height()+$(theElement).height();
var my_footer_position = $('#my_d_footer').position();
var my_footer_pos_top = my_footer_position.top+$(theElement).height();
/* copy from your page the code below and change the clip bottom to 9999px or a value big enough to accomodate all menus expanded */
$('#xr_xri').attr('style', 'width: 957px; clip: rect(0px, 957px, 9999px, 0px);');
$('#xr_xri').height(xri_height);
$('#my_background').height(my_background_height);
$('#my_d_footer').css('top',my_footer_pos_top);
/* end code for wd6 */

And I put the follwing code in the code that contracts the menu

/* start contract code for wd6 */
var xri_height = $('#xr_xri').height()-$(theElement).height();
var my_background_height = $('#my_background').height()-$(theElement).height();
var my_footer_position = $('#my_d_footer').position();
var my_footer_pos_top = my_footer_position.top-$(theElement).height();
$('#xr_xri').height(xri_height);
$('#my_background').height(my_background_height);
$('#my_d_footer').css('top',my_footer_pos_top);
/* end code for wd6 */

[charissepaula]

I will give this a try in next website I need a vertical menu... I ended up using a multi-layered horizontal menu - a bit more complex and not easy to maintain