" fixed navbar menu"
Bootstrap 3.0.0 Snippet by adriano3429

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="navbar navbar-default" data-spy="affix" id="navbar"> <div class="container"> <div class="col-md-3 col-xs-12 col-sm-12"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand holder" href="#"><i class="fa fa-fonticons" aria-hidden="true">TINESSCLUB</i></a> </div> </div> <div class="col-md-9 col-xs-12 col-sm-12"> <div class="collapse navbar-collapse holder"> <ul class="nav navbar-nav navbar-right"> <li><a href="#">Home</a></li> <li><a href="#about">About US</a></li> <li><a href="#whoiam">Classes</a></li> <li><a href="#contact">Gallery</a></li> <li><a href="#whoiam">Pricing</a></li> <li><a href="#contact">Contact Us</a></li> </ul> </div><!--/.nav-collapse --> </div> </div> </div>
/* Set the fixed height of the footer here */ #footer { height: 60px; background-color: #f5f5f5; } /* Custom page CSS -------------------------------------------------- */ /* Not required for template or sticky footer method. */ #wrap > .container { padding: 60px 15px 0; } .container .credit { margin: 20px 0; } #navbar { width: 100%; top:-60px; } #navbar.affix-top { position:fixed; top: 0px; -webkit-transition: all 0.8s ease; } #navbar.affix { position:fixed; top:0; bottom:60; -webkit-transition: all 1s ease; background: #d4145a; padding: 12px; border: none; z-index: 1; } #footer > .container { padding-left: 15px; padding-right: 15px; } code { font-size: 80%; } .collapse.navbar-collapse.holder li a { color: white; } .collapse.navbar-collapse.holder li a:hover{ font-weight: bold; font-size: 17px; } a.navbar-brand.holder { font-size: 26px; letter-spacing: 3px; color: white; } a.navbar-brand.holder:hover{ font-weight: bold; color: white; font-size: 29px; } .collapse.navbar-collapse.holder li { margin-left: 20px; }

Related: See More


Questions / Comments: