CSS3 Accordion Menu

[daydreamer]

Hi,

Could anyone please help me add this menu for WB
http://bloomwebdesign.net/myblog/2012/05/24/create-a-vertical-accordion-menu-using-css3-tutorial/

Thanks

[nibz]

In this post i have a acccordeon menu:
https://forum.WebsiteBaker.org/index.php/topic,23878.msg162424.html#msg162424

This is built with Javascript (will have a look if i can implement one with CSS3)

[nibz]

Ok i am having a go with Show Menu2

Code: [Select]

<?php show_menu2(1, SM2_ROOT, SM2_ALL, SM2_ALL|SM2_PRETTY, '[if(level==0){<li id="[page_id]"><a href="#[page_id]">[menu_title]</a>}][if(level>0){<li id="[page_id]"><a href="[url]">[menu_title]</a>}]', '</li>', '<ul class="sub-menu">', '</ul>', false, '<ul class="ac-menu">'); ?>
It has some disadvantages;

• There have to be more than 3 subpages (or else the styling is ugly).
• The root items don't have links! (only to open accordions), so if you don't have any child pages beneath a root page the root doesn't link to anything.

I think JS would be better (at least it works!), you will need more conditional formatting in Show_menu2 (you'll need someone who know's this [better than me )

Show menu2 expert wanted

[Argos]

Is dit niet gewoon het standaard menugedrag van de default WB Round template? En van de Andreas0 en Andreas1 templates?

Zie http://template.websitebaker2.org/pages/en/archive.php?id=46&sort_order=4

Die template gebruik ik vaak als basis voor simpele sites als:
http://www.interactadvies.nl/
http://www.supervisorvanhetjaar.nl/

Het enige is dat er geen leuk jQuery-effectje inzit. Maar dat kun je er wellicht zelf inknutselen.

Ik zou overigens zelf geen CSS3 menu in een site gebruiken, althans niet zonder fallback voor wat oudere browsers. Er zijn nog heeeeeeeeel veel gebruikers met IE7 en IE8.

[nibz]

@Argos Dit is niet het standaardgedrag want het is daadwerkelijk een accordion waarbij de ouder pagina's geen "echte" pagina openen maar ze openen slechts het submenu. (d.m.v. de accordion code).

Ik snap je gedachtegang betreffende de CSS3 ik zou zelf ook liever gebruik maken van javascript.
(zelfde functionaliteit alleen dan wel cross browser)

Dit script is te downloaden in het forum-topic: https://forum.WebsiteBaker.org/index.php/topic,23878.msg162424.html#msg162424

--------------------------------------[b.t.w. we are on the english forum]------------------------------------------------------------

Quick translation:
@Argos This isn't the default behavior. This is really an accordion where the parent pages don't open "real" pages but they just open the submenu (using accordion css code)

I'm also more a fan of the cross-browser way (not css3) but JS
Download: https://forum.WebsiteBaker.org/index.php/topic,23878.msg162424.html#msg162424

[Argos]

Oops... sorry about the Dutch  

I think this menu is far better: http://designmodo.com/jquery-accordion-menu/

The problem that you don't want the parent items to link to a page van be overcome in 2 ways:
1. make each parent a page type Menu Link, instead of WYSIWYG. Link the parent to the first child.
2. make the parent menu items static, and let WB only create child items automatically. In this case you need to make each child items block a separate menu.