html - My bootstrap navigation pills aren't working -


i'm trying set bootstrap pill nav menu, reason pills aren't working , content shows on 1 page, though active pill change.

    <div class="navigation">         <ul class="nav nav-pills head-menu" id="navbar">           <li class="active"><a href="#abouttab" data-toggle="pill">about us</a></li>           <li><a href="#sponsorstab" data-toggle="pill" >sponsors</a></li>           <li><a href="#conferencetab" data-toggle="pill">conference</a></li>           <li><a href="#execstab" data-toggle="pill">execs</a></li>           <li><a href="#gallerytab" data-toggle="pill">gallery</a></li>           <li><a href="#contacttab" data-toggle="pill">contact us</a></li>         </ul>       </div>    <div class="tab-content">  <div class="tab-pane" id="abouttab"> <h1>testing</h1> </div>   <div class="tab-pane" id="sponsorstab"> <p>place holder text</p>  </div> </div> 

any solution?

my head

  <!doctype html>  <html>  <head>  <meta charset="utf-8">  <title>untitled</title>  <link rel="stylesheet" type="text/css" href="menu.css"> <link rel="stylesheet" type="text/css" href="main.css"> <link rel="stylesheet" type="text/css" href="about-page.css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="bootstrap.min.css"> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>  <script src="bootstrap.min.js"></script> 

your code appears correct. here's jsfiddle used test: http://jsfiddle.net/zqpfo8f5/

are sure you're adding bootstrap's required files?

<!doctype html> <html lang="en">   <head>     <meta charset="utf-8">     <meta http-equiv="x-ua-compatible" content="ie=edge">     <meta name="viewport" content="width=device-width, initial-scale=1">     <title>bootstrap 101 template</title>      <!-- bootstrap -->     <link href="css/bootstrap.min.css" rel="stylesheet">   </head>   <body>     <h1>hello, world!</h1>      <!-- jquery (necessary bootstrap's javascript plugins) -->     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>     <!-- include compiled plugins (below), or include individual files needed -->     <script src="js/bootstrap.min.js"></script>   </body> </html> 

Comments

Popular posts from this blog

matlab - "Contour not rendered for non-finite ZData" -

delphi - Indy UDP Read Contents of Adata -

javascript - Any ideas when Firefox is likely to implement lengthAdjust and textLength? -