Skip to content

Instantly share code, notes, and snippets.

@danshearmur
Last active December 17, 2015 12:48
Show Gist options
  • Save danshearmur/5611996 to your computer and use it in GitHub Desktop.
Save danshearmur/5611996 to your computer and use it in GitHub Desktop.
<!doctype html>
<html>
<head>
<link href="bootstrap.css" rel="stylesheet"/>
<style>
#expanded:target .nav-collapse {
height: auto;
}
.navbar .btn-contract {
display: none;
}
#expanded:target .btn-contract {
display: block;
}
#expanded:target .btn-expand {
display: none;
}
</style>
</head>
<body id="expanded">
<div class="navbar">
<div class="navbar-inner">
<!-- navbar button to expand the display of nav elements -->
<a class="btn btn-navbar btn-expand" href="#expand">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<!-- navbar button to contract the display of nav elements -->
<a class="btn btn-navbar btn-contract" href="#">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<div class="nav-collapse collapse">
<!-- actual nav items -->
</div>
</div>
</div>
<!-- rest of the site -->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment