Ads

Thursday, 27 November 2014

Bootstrap Sub-Menus



Download   Demo
Bootstrap Sub-Menus is a jQuery plugin to create sub-menus for Bootstrap’s navbar, dropdown, dropup and pills.
Min Requirements
  • Bootstrap 3.0.0
  • jQuery 1.9.1
1. INCLUDE CSS AND JS FILES
<link rel="stylesheet" href="dist/css/bootstrap-submenu.min.css">
 
<script src="http://code.jquery.com/jquery-2.1.1.min.js" defer></script>
<script src="dist/js/bootstrap-submenu.min.js" defer></script>
2. HTML
<div class="dropdown m-b">
  <button class="btn btn-default" type="button" data-toggle="dropdown" aria-expanded="false">
    Dropdown
    <span class="caret"></span>
  </button>
 
  <!-- role="menu": fix moved by arrows (Bootstrap dropdown) -->
<ul class="dropdown-menu" role="menu">
  <li><a tabindex="0">Action</a></li>
  <li class="dropdown-submenu">
    <a tabindex="0" data-toggle="dropdown" aria-expanded="false">Another action</a>
 
    <ul class="dropdown-menu">
      <li class="dropdown-header">Dropdown header</li>
      <li><a tabindex="0">Sub action</a></li>
      <li class="disabled"><a tabindex="0">Another sub action</a></li>
      <li><a tabindex="0">Something else here</a></li>
    </ul>
  </li>
  <li><a tabindex="0">Something else here</a></li>
  <li class="divider"></li>
  <li><a tabindex="0">Separated link</a></li>
</ul>
</div>
3. JAVASCRIPT

$('.dropdown-submenu > a').submenupicker();

No comments:

Post a Comment