CMS Made Simple Forums

Code: Select all

.accordion-menu li { width:165px; }
.accordion-menu a {
	display:block;
	width:153px;
	padding:6px;
	background: black;
	margin:0px 0px 8px 0px;
	text-decoration:none;
	color:#FFF;
	font-weight:bold;
}

.accordion-menu p {
	display:block;
	width:153px;
	padding:6px;
	background: black;
	margin:0px 0px 8px 0px;
	text-decoration:none;
	color:#FFF;
	font-weight:bold;
}

.accordion-menu li:hover {
	background: green;
}

.accordion-menu p:hover {
	background: green;
	cursor: pointer; cursor: hand
}

.accordion-menu ul a {
	width:153px;
	background:#FFF;
	border-bottom:1px solid #00F;
	color:#000;
	margin: -8px 0px 8px 0px;
}
.accordion-menu ul a:hover {
	color:#000;
	background: #CCC;
}
.accordion-menu, .accordion-menu ul { padding:0; margin:0; }
.accordion-menu li { list-style:none; }
.accordion-menu li ul { display:none; }

Code: Select all

<__script__ src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></__script>

Code: Select all

{literal}
<__script__ type="text/javascript">

if((navigator.userAgent.match(/iPad/i))) {
$(document).ready(function () {    
    $('.accordion-menu li').hover(
        function () {
            $('ul', this).stop(true, true).delay(200).slideDown(200);
        },
        function () {
            $('ul', this).stop(true, true).slideUp(200);            
        });
		
});
}
else if(navigator.userAgent.match(/iPhone/i)) {
$(document).ready(function () {    
    $('.accordion-menu li').hover(
        function () {
            $('ul', this).stop(true, true).delay(200).slideDown(200);
        },
        function () {
            $('ul', this).stop(true, true).slideUp(200);            
        });
		
});
}
else
{
function initMenu() {
    $('.accordion-menu li ul').hide(); 
    $('.accordion-menu li p').on('click', function() {
        $('.accordion-menu li ul').slideUp();
        $(this).next().slideDown();
    });
}
$(document).ready(initMenu);
}

</__script>
{/literal}

Code: Select all

{if $count > 0}
<ul class="accordion-menu">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</li>
{elseif $node->index > 0}</li>
{/if}

{if $node->current == true}
<li><a href="{$node->url}" class="currentpage"{if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} </a>

{elseif $node->parent == true && $node->depth == 1 and $node->type != 'sectionheader' and $node->type != 'separator'}
<li class="activeparent"> <a href="{$node->url}" class="activeparent"{if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} </a>

{elseif $node->type == 'sectionheader'}
<li><p>{$node->menutext}</p>

{elseif $node->type == 'separator'}
<li style="list-style-type: none;"> <hr class="separator" />

{else}
<li><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}> {$node->menutext} </a>

{/if}

{/foreach}

{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}