lintel-contrib-dropdowns
Version:
Dropdowns for lintel.
77 lines (68 loc) • 2.53 kB
HTML
<html>
<head>
<link rel="stylesheet" href="../../bower_components/lintel/dist/lintel.css">
<link rel="stylesheet" href="../../dist/dropdowns.css">
<script src="../../bower_components/jquery/dist/jquery.js"></script>
<script src="../../dist/dropdowns.js"></script>
</head>
<body class="pad">
<div class="btn-group">
<button class="btn btn-dropdown-toggle" type="button" aria-haspopup="true" aria-expanded="false">
Dropdown
<span class="btn-caret" aria-hidden="true"></span>
</button>
<ul class="dropdown" role="menu">
<li><a href="#">Action 1</a></li>
<li><a href="#">Action 2</a></li>
<li><a href="#">Action 3</a></li>
<li class="dropdown-divider"></li>
<li><a href="#">Alt Action 1</a></li>
</ul>
</div>
<div class="btn-group">
<button class="btn btn-dropdown-toggle" type="button" aria-haspopup="true" aria-expanded="false">
Dropdown
<span class="btn-caret" aria-hidden="true"></span>
</button>
<ul class="dropdown" role="menu">
<li><a href="#">Action 1</a></li>
<li><a href="#">Action 2</a></li>
<li><a href="#">Action 3</a></li>
<li class="dropdown-divider"></li>
<li><a href="#">Alt Action 1</a></li>
</ul>
</div>
<br><br>
<div class="btn-group open">
<button class="btn btn-dropdown-toggle" type="button">
Dropdown
<span class="btn-caret" aria-hidden="true"></span>
</button>
<ul class="dropdown" role="menu">
<li><a href="#">Action 1</a></li>
<li><a href="#">Action 2</a></li>
<li><a href="#">Action 3</a></li>
<li class="dropdown-divider"></li>
<li><a href="#">Alt Action 1</a></li>
</ul>
</div>
<br><br><br><br><br><br><br><br><br><br>
<div class="btn-group open">
<button class="btn" type="button">Split Dropdown</button>
<button class="btn btn-dropdown-toggle" type="button" aria-label="More Options"><span class="btn-caret" aria-hidden="true"></span></button>
<ul class="dropdown" role="menu">
<li><a href="#">Action 1</a></li>
<li><a href="#">Action 2</a></li>
<li><a href="#">Action 3</a></li>
<li class="dropdown-divider"></li>
<li><a href="#">Alt Action 1</a></li>
</ul>
</div>
<script>
$('.btn-dropdown-toggle').click(function(e) {
$(this).dropdown('toggle');
});
</script>
</body>
</html>