1. INTRODUCTION (section header)
1.1 item1
1.2 item2
2. CONTACT (section header)
2.1 item3
2.2 item4
What i would like is to have the section headers closed by default. If you click on INTRODUCTION, it opens and item1 & item2 are shown. When you click on CONTENT, INTRODUCTION closes and item3 & item4 are shown.
When you click on an item it must stay in focus.
I tried to use the Section_Expand menu (below) and came a long way with it, only the other Section headers aren't closing when you click on one of them. Does anyone know how to do this? I don't understand much of the menu coding techniques (aer they all Smarty tags?)
Code: Select all
{* CSS classes used in this template:
#active - The active/current page
li#separator - To style the ruler for the separator
span.sectionheader - To style section header *}
{if $count > 0}
<__script__ type="text/javascript" language="javascript" src="lib/helparea.js"></__script>
<div class="menu">
<ul id="menu">
{assign var="prevdepth" value="1"}
{foreach from=$nodelist item=node}
{assign var="prevdepth" value=$prevnode->depth}
{if ($node->depth <= $prevdepth)}
{if ($prevnode->haschildren == "1")}<li></li></ul></div></li> {* bugfix if subitems were not shown in menu *}
{else}
{if $node->depth < $prevdepth}
{assign var="act_depth" value=$prevdepth-$node->depth}</li>
{while (($act_depth > 0) and ($collapseopened > 0))}
</ul></div></li>
{assign var="act_depth" value=$act_depth-1}
{assign var="collapseopened" value=$collapseopened-1}
{/while}
{else}
</li>
{/if}
{/if}
{/if}
{if $node->type == 'separator'}
<li id="separator"></li>
{else}
{if $node->current == true}<li id="active">
{else}<li>
{/if}
<a id="pic{$node->id}" {if $node->type != 'sectionheader'}href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}{/if}{if $node->haschildren == '1'}
{assign var="collapseopened" value=$collapseopened+1} onclick="expandcontent('sub{$node->id}')"{else}{/if} style="cursor:hand; cursor:pointer">
{if $node->type == 'sectionheader'}<span class="sectionheader">{/if}
{$node->menutext}
{if $node->type == 'sectionheader'}</span>{/if}
</a>
{if $node->haschildren == '1'}<div id="sub{$node->id}" class="expand"><ul>{/if}
{/if}
{assign var="prevnode" value=$node}
{/foreach}
{if ($prevnode->haschildren == "1")}<li></li></ul></div></li> {* bugfix if subitems were not shown in menu *}
{else}
{if $prevnode->depth > 1}
{assign var="act_depth" value=$prevnode->depth-1}</li>
{while (($act_depth > 0) and ($collapseopened > 0))}
</ul></div></li>
{assign var="act_depth" value=$act_depth-1}
{assign var="collapseopened" value=$collapseopened-1}
{/while}
{else}
</li>
{/if}
{/if}
</ul>
</div>
{/if}