SemantiUI: Sidebar flyout menu - sidebar

Question

I am trying to get a Fly-out type menu launched from a sidebar. Any ideas/examples? Wondering if Popups are an option?
Ex: When user has their mouse over the settings icon, I want a menu to "fly-out" with the 3 options..,
<div id="mnuSideNav" class="ui vertical menu labeled icon inverted sidebar">
<div id="mnuAdmin" class="item ">
<i class="settings icon" title="Administrative Settings"></i>
<div id="mnuAdminItems" class="inverted menu">
<a class="item"><i class="edit icon"></i> Edit Profile</a>
<a class="item"><i class="globe icon"></i> Choose Language</a>
<a class="item"><i class="settings icon"></i> Account Settings</a>
</div>
</div>
</div>

Answer 1

Resolved this using a popup..,
Elements like that support overflow cannot have menus extend beyond the sidebar ("Fly-out"). So Pop-ups are the only option. Define a popup and in the javascript initializing the popup set its popup parameter..,
Ex: SideBar:
<div id="mnuSideNav" class="ui left vertical menu labeled icon inverted sidebar">
<a id="sbAdmin" class="browse item popupMenu">
<i class="settings icon" title="Administrative Settings"></i>
</a>
</div>
Popup
<div id="adminPopup" class="ui popup ">
<div class="ui one column relaxed equal height left aligned grid ">
<div class="ui column ">
<h4 class="ui header">Admin Menu</h4>
</div>
</div>
</div>
Script:
$('.popupMenu').popup({
popup: '#adminPopup',
inline : true,
hoverable: true,
position : 'right center',
delay: {show: 300, hide: 800}
});