Dropdown in Bootstrap won't work

StackOverflow https://stackoverflow.com/questions/22159848

Question

I've looked at previous questions and moved stuff around but it doesn't seem to work. I'm thinking that there something wrong with me referencing the bootstrap scripts and links. I've taken stuff out in iterations but it hasn't solved the problem yet. Thanks for the help.

<! DOCTYPE html>
<html>
<head>
<title>Austin Band Map</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href = "bootstrap.min.css" rel = "stylesheet">
    <link href = "css/styles.css" rel = "stylesheet">   
    <link href="css/bootstrap.min.css/navbar-static-top.css" rel="stylesheet">

    <link href="BootStrap.css" rel="stylesheet" />
    <link href="css/bootstrap.css" rel="stylesheet">  
</head>

  <body>
  <div>
  <img border="0" src="MapBlueprint.jpg" width="1000" height="600">

  <div/>
    <div class="navbar navbar-fixed-bottom navbar-inverse" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="home.html">Austin Band Map</a>
        </div>
        <div class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li><a href="about.html">About</a></li>
            <li><a href="contact.html">Contact</a></li>
            <li><a href="listview.html">List View</a></li>
            <li><a href="login.html">Login</a></li>
     <!--   <div class="dropdown"> -->
            <li class ="dropdown">      
                <a href = "" class = "dropdown-toggle" data-toggle = "dropdown">Austin Venues<b class="caret"></b></a>
                <ul class = "dropdown-menu">
                    <li><a href = "#">Antone's</a></li>
                    <li><a href = "#">Austin 360</a></li>
                    <li><a href = "#">Austin Music Hall</a></li>
                    <li><a href = "#">The Backyard</a></li>
                    <li><a href = "#">Bass Concert Hall</a></li>
                    <li><a href = "#">Emo's</a></li>
                    <li><a href = "#">Festivals</a></li>
                    <li><a href = "#">Frank Erwin Center</a></li>
                    <li><a href = "#">Hole In The Wall</a></li>
                    <li><a href = "#">Lambert's</a></li>
                    <li><a href = "#">Mohawk</a></li>
                    <li><a href = "#">Parish</a></li>
                    <li><a href = "#">Red 7</a></li>
                    <li><a href = "#">Stubb's</a></li>
                </ul>
            </li>
          </ul>
        </div><!-- /.nav-collapse -->
      </div><!-- /.container -->
    </div><!-- /.navbar -->

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script> 
    <script src="js/jquery.js"></script>
    <script src="js/bootstrap.min.js"></script>


  </body>
</html>

No correct solution

OTHER TIPS

Try this out

<!--Javascript dependencies and other libraries such as jquery UI-->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
  <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"> 
  <\/script>');</script>
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top