jquery ui menubar
by shengoo
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://grandecourse.com/sites/all/libraries/jquery-ui-1.9m6/ui/jquery.ui.menubar.js"></script>
<ul id="menubar" class="nav nav-tabs">
<li> <a href="#File">File</a>
<ul>
<li><a href="#Open...">Open...</a>
</li>
<li class="ui-state-disabled">Open recent...</li>
<li><a href="#Save">Save</a>
</li>
<li><a href="#Save as...">Save as...</a>
</li>
<li><a href="#Close">Close</a>
</li>
<li><a href="#Quit">Quit</a>
</li>
</ul>
</li>
<li> <a href="#Edit">Edit</a>
<ul>
<li><a href="#Copy">Copy</a>
</li>
<li><a href="#Cut">Cut</a>
</li>
<li class="ui-state-disabled">Paste</li>
</ul>
</li>
<li> <a href="#View">View</a>
<ul>
<li><a href="#Fullscreen">Fullscreen</a>
</li>
<li><a href="#Fit into view">Fit into view</a>
</li>
<li> <a href="#Encoding">Encoding</a>
<ul>
<li><a href="#Auto-detect">Auto-detect</a>
</li>
<li><a href="#UTF-8">UTF-8</a>
</li>
<li> <a href="#UTF-16">UTF-16</a>
<ul>
<li><a href="#Option 1">Option 1</a>
</li>
<li><a href="#Option 2">Option 2</a>
</li>
<li><a href="#Option 3">Option 3</a>
</li>
<li><a href="#Option 4">Option 4</a>
</li>
</ul>
</li>
</ul>
...
JavaScript
$("#menubar").menubar({
autoExpand: true,
menuIcon: true,
buttons: true,
select: function (event, ui) {
var a = ui.item.find('a');
/*MessageRouter({
nodeid: a.attr('href').replace('#', ''),
reportid: a.attr('reportid'), action: a.attr('action'),
nodetext: ui.item.text(),
source: 'menu',
trace: a.attr('trace'),
ric:a.data('ric')
});*/
}
});
$('#menubar >li >a').click(function (e) {
var a = $(e.currentTarget);
/*MessageRouter({
nodeid: a.attr('href').replace('#', ''),
reportid: a.attr('reportid'), action: a.attr('action'),
nodetext: a.find('div').attr('title'),
source: 'menu',
trace: a.attr('trace'),
ric: a.data('ric')
});*/
});