Bootstrap3: Dropdown menu

Question

I am making a site using Bootstrap 3.0.0 All is fine except that the dropdown menu is not working. In the head of the file i am making this declarations:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.css" rel="stylesheet">

<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" />

<link href="http://fonts.googleapis.com/css?family=Abel|Open+Sans:400,600" rel="stylesheet" />

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/dropdown.js"></script>

Something is missing there?

The html should be correct:

<li class="dropdown">
        <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown-example<span class="caret"></span></a>
        <ul class="dropdown-menu">
          <li><a href="#link-1">link 1</a></li>
          <li><a href="#link-2">link 2</a></li>
          <li><a href="#link-3">link 3</a></li>
          <li><a href="#link-4">link 3</a></li>
        </ul>
      </li>

Does anyone knows how to do?

Could you please create a jsfiddle.net of this? It will help solve your issue. — Termato
– Termato, Commented Oct 7, 2014 at 15:43

jporcenaluk · Accepted Answer · 2013-09-05 12:44:34Z

2

Link to your external javascript file jquery.js before Bootstrap.js.

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/dropdown.js"></script>

You need to load jQuery before you use it.

answered Sep 5, 2013 at 12:44

jporcenaluk

96610 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

FrancescoMussi Over a year ago

Now when i click it appears a yellow rectangle around the box, before no. But still does not show the dropdown menu

jarasss · Accepted Answer · 2013-09-05 10:13:21Z

1

I'm not sure but this scripts should be probably included at the end of html document

<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/dropdown.js"></script>

Did you include jQuery too? Bootstrap plugins depend on this.

answered Sep 5, 2013 at 10:13

jarasss

5283 silver badges13 bronze badges

3 Comments

FrancescoMussi Over a year ago

Thanks for the reply. I added jquery.js but unfortunately is still not working

jarasss Over a year ago

i believe that it's because of the library import order... Could you post the whole code using pastebin or jsfiddle.net ?

FrancescoMussi Over a year ago

Ok, thank you. The css i have taken from bootstraptor, and is a showcase of many possibilities of Bootstrap 3. All it works fine except dropdown. Also for another project i need dropdown and is not working. I am not understanding what i miss to make it working... Here i put the code: paste.laravel.com/OmT

fixxxer · Accepted Answer · 2013-11-24 16:53:50Z

0

Just close the tag where you link to bootstrap.css. The "/" before the last angle bracket is missing in the code in your question. <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.css" rel="stylesheet" />

answered Nov 24, 2013 at 16:53

fixxxer

16.3k15 gold badges64 silver badges78 bronze badges

Collectives™ on Stack Overflow

Bootstrap3: Dropdown menu

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related