2014-12-09 6 views
0

Я пытаюсь получить меню типа «Fly-out», запущенное с боковой панели. Любые идеи/примеры? Хотите узнать, являются ли всплывающие окна опцией?SemantiUI: всплывающее меню боковой панели

Ex: Когда пользователь имеет указатель мыши на значок настроек, я хочу меню «флай-аут» с 3-х вариантов ..,

<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> 

ответ

0

Решенный это с помощью всплывающего окна ..,

Элементы, подобные переполнению поддержки, не могут иметь меню, выходящее за боковую панель («Вылет»). Таким образом, всплывающие окна являются единственным вариантом. Определить всплывающее окно и в JavaScript инициализации всплывающего окна установить его всплывающий параметр ..,

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> 

Сценарий:

$('.popupMenu').popup({ 
     popup: '#adminPopup', 
     inline : true, 
     hoverable: true, 
     position : 'right center', 
     delay: {show: 300, hide: 800} 
    }); 
+0

Это ISN Я работаю для меня! http://plnkr.co/edit/5c6SnX?p=preview Не могли бы вы собрать jsfiddle или plunk, чтобы я мог видеть, как он работает в действии? –

Смежные вопросы