Monday, October 17, 2016
Cara Membuat Menu Navbar Responsive Dengan Bootstrap
Cara Membuat Menu Navbar Responsive Dengan Bootstrap
Menu Navbar Responsive yaitu menu navbar yang bisa menyesuaikan diri dengan ukuran halaman web browser. Saat kondisi maksimize menu itu akan tampil semua, namun saat dalam kondisi dikecilkan maka menu itu akan menyesuaikan diri menjadi menu list. Sebagai contoh buka saja alamat http://twitter.github.com/bootstrap/
Contoh Gambar hasil dari Navbar nya :
Cara Membuat Menu Navbar Responsive Dengan Bootstrap
Script Membuat Menu Navbar Responsive Dengan Bootstrap
Script Membuat Menu Navbar Responsive Dengan Bootstrap
<!--Navbar Start @autor : Parwito-->
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".subnav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">Coba1 Themes</a>
<div class="nav-collapse subnav-collapse">
<ul class="nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-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 class="nav-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
<form class="navbar-search pull-left" action="">
<input class="search-query span2" placeholder="Search" type="text">
</form>
</div><!-- /.nav-collapse -->
</div>
</div>
</div>
<!--Navbar end-->
Go to link Download
