Skip to content

Instantly share code, notes, and snippets.

@DrewDouglass
Created May 3, 2016 16:16
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save DrewDouglass/fb70b9ab6ddbfc044c963ae6d9b10d93 to your computer and use it in GitHub Desktop.
Save DrewDouglass/fb70b9ab6ddbfc044c963ae6d9b10d93 to your computer and use it in GitHub Desktop.
Show bootstrap dropdown menus on hover instead of click.
/***ADD THE JAVASCRIPT BELOW IF MAIN DROPDOWN ITEM TO BE CLICKABLE***/
/***http://stackoverflow.com/questions/8878033/how-to-make-twitter-bootstrap-menu-dropdown-on-hover-rather-than-click***/
.sidebar-nav {
padding: 9px 0;
}
.dropdown-menu .sub-menu {
left: 100%;
position: absolute;
top: 0;
visibility: hidden;
margin-top: -1px;
}
.dropdown-menu li:hover .sub-menu {
visibility: visible;
}
.dropdown:hover .dropdown-menu {
display: block;
}
.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
margin-top: 0;
}
.navbar .sub-menu:before {
border-bottom: 7px solid transparent;
border-left: none;
border-right: 7px solid rgba(0, 0, 0, 0.2);
border-top: 7px solid transparent;
left: -7px;
top: 10px;
}
.navbar .sub-menu:after {
border-top: 6px solid transparent;
border-left: none;
border-right: 6px solid #fff;
border-bottom: 6px solid transparent;
left: 10px;
top: 11px;
left: -6px;
}
$('.dropdown-toggle').click(function() {
var location = $(this).attr('href');
window.location.href = location;
return false;
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment