[%- USE L %]
-<style type='text/css'>
- #html-menu { float:left; white-space: nowrap; }
- #html-menu tr { vertical-align: top; }
- #html-menu div.menuitem { padding: 2px 4px 1px 4px; }
- #html-menu div.submenu { font-weight: bold }
- #html-menu img { vertical-align: middle; visibility:hidden; border: 0; }
- #html-menu div.menuitem:first-child img { visibility:visible }
- #html-menu a { vertical-align: top }
- #html-menu .item span.menu-spacer { display: inline-block; width: 24px }
- #html-menu .menu span.menu-spacer { display: inline-block; width: 32px }
-</style>
+[%- USE HTML %]
<body class="menu">
<div id='html-menu'>
- [% INCLUDE sections %]
-</div>
-</body>
-</html>
-[%- BLOCK sections %]
[%- FOREACH item IN sections %]
- <div class='menu-multiline'>
- [% SET menuouterloopcount = loop.count %]
- [%- FOREACH chunk IN item.chunks %]
- <div id='menuitem[% menulevel %]_[% menuouterloopcount %]' class='menuitem [% item.class %] hover'>[% PROCESS item %]</div>
- [%- END %]
- [%- IF item.subitems.size %]
- <div id='menuitem[% menulevel %]_[% loop.count %]_submenu' class='menu-submenu[% menulevel %]'>
- [% INCLUDE sections sections=item.subitems, menulevel='_'+loop.count %]
- </div>
- [%- END %]
+ <div id='mi[% item.item_id %]' class='mi [% item.spacer %] [% item.class %]'>[%- IF item.href %]
+ <a href="[% item.href | html %]" class='ml' target='[% item.target %]'><span class="mii ms">[% L.img_tag(item.img) %]</span><span class='mic'>[% item.label %]</span></a>[%- ELSE %]
+ <span class="mii ms">[% L.img_tag(item.img) %]</span><span class='mic'>[% item.label %]</span>[%- END %]
</div>
[%- END %]
-[%- END %]
-[%- BLOCK item %]
- [% item.spacer %]
- [%- IF item.href %]
- [% L.link(item.href, L.html_tag('span', L.html_tag('img', undef, item.img), class='menu-spacer') _ chunk, target=item.target) %]
- [%- ELSE %]
- [% L.html_tag('img', undef, item.img) _ chunk %]
- [%- END %]
-[%- END %]
-
-</body>
-
+</div>
<script type='text/javascript'>
$(function(){
- $('#html-menu div.menu-submenu').hide();
- $('#html-menu div.menu, #html-menu div.submenu').each(function() {
+ $('#html-menu div.i, #html-menu div.sm').hide();
+ $('#html-menu div.m').each(function() {
$(this).click(function(){
- $('#html-menu div.menu-submenu').not('#' + $(this).attr('id') + '_submenu').hide();
- $('#' + $(this).attr('id') + '_submenu').toggle();
+ $('#html-menu div.mi').not('div.m').not('[id^=' + $(this).attr('id') + '_]').hide();
+ $('#html-menu div.mi[id^=' + $(this).attr('id') + '_]').toggle();
});
});
});
</script>
+</body>
+</html>