"User preferences in Nav Bar"
Bootstrap 2.3.2 Snippet by msurguy

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/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-inverse nav"> <div class="navbar-inner"> <div class="container"> <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </a> <a class="brand" href="/">CMS</a> <div class="nav-collapse collapse"> <ul class="nav"> <li class="divider-vertical"></li> <li><a href="#"><i class="icon-home icon-white"></i> Home</a></li> </ul> <div class="pull-right"> <ul class="nav pull-right"> <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">Welcome, User <b class="caret"></b></a> <ul class="dropdown-menu"> <li><a href="/user/preferences"><i class="icon-cog"></i> Preferences</a></li> <li><a href="/help/support"><i class="icon-envelope"></i> Contact Support</a></li> <li class="divider"></li> <li><a href="/auth/logout"><i class="icon-off"></i> Logout</a></li> </ul> </li> </ul> </div> </div> </div> </div> </div>

Related: See More


Questions / Comments:

Thank you!

Mila (0) - 5 years ago - Reply 0


Thank you very much :)

Kanokon Chansom (0) - 5 years ago - Reply 0


Thank you!

Ku Jokonjo (0) - 5 years ago - Reply 0


Remove the collapse class on line 11 if it is not working.

Kevin Hoekman (0) - 5 years ago - Reply 0


Very nice but is normal that submenu is not showing ? it seem that overflow not working...

Growlab (0) - 5 years ago - Reply 0


Very nice but dropdown is always expanded when viewed responsively - tried the js subs added but no difference here

SimonAntony (0) - 5 years ago - Reply 0


when i want to add a "navbar-fixed-top" such as this page navbar,not work well!why?

shay (0) - 5 years ago - Reply 0


It's beautiful thank you, but it didn't work well in responsive mode, or maybe this is the way it was designed, thank you anyways.

Rami (0) - 5 years ago - Reply 0


Add this in head section of the page:

<script type="text/javascript">
$(document).ready(function () {
$('.dropdown-toggle').dropdown();
});
</script>

subs (0) - 5 years ago - Reply 0


what do you see instead? what exactly didn't work?

maxsurguy (0) - 5 years ago - Reply 0


Thanks Bro !

Nishant (0) - 5 years ago - Reply 0


:)

John Doe (0) - 5 years ago - Reply 0


I'm glad that somebody find it usefull :)

Slavomir J (0) - 5 years ago - Reply 0


Thank you very much, I have made my own user preferences, but choose to use yours instead, very neat.

Steferson (0) - 5 years ago - Reply 0


It's will be usefull for my new project ! Thanks for share!

Cezinha (0) - 5 years ago - Reply 0