"Dropdown on hover"
Bootstrap 3.1.0 Snippet by msurguy

<div class="container"> <div class="row"> <p class="lead">Roll over the button on the left to see a dropdown</p> Rollover dropdown: <!-- Our Special dropdown has class show-on-hover --> <div class="btn-group show-on-hover"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </div> Regular dropdown: <!-- Single button --> <div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"> Action <span class="caret"></span> </button> <ul class="dropdown-menu" role="menu"> <li><a href="#">Action</a></li> <li><a href="#">Another action</a></li> <li><a href="#">Something else here</a></li> <li class="divider"></li> <li><a href="#">Separated link</a></li> </ul> </div> </div> </div>
body{ padding:10px; } .show-on-hover:hover > ul.dropdown-menu { display: block; }

Similar snippets: See More


Comments:

comments powered by Disqus