Take the 2-minute tour ×

Following on from this question, I am still struggling with the Twitter Bootstrap. I've managed to get my navigation bar to appear and I'm trying to add a drop down menu to it. No matter what I try, I can't actually get the drop down part of the menu to work! Here is a screenshot of my menu.

navigation bar

As you can see, I have "Account Settings" which should be a drop down menu but when I click on it, no drop down options appear. Below is my code:

<!DOCTYPE html>
    <meta charset="utf-8" />

    <script src="@Url.Content("~/Scripts/bootstrap.js")" type="text/javascript"></script>
    <script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {

    <link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" />

    <div class="navbar">
        <div class="navbar-inner">
            <div class="container">
                <ul class="nav">
                    <a class="brand" href="#">Present Ideas</a>
                    <li class="dropdown" id="accountmenu">
                        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Account Settings<b class="caret"></b></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Register</a></li>
                            <li class="divider"></li>
                            <li><a href="#">Logout</a></li>
    <div class="container-fluid">

As you can see, I'm referencing the dropdown Javascript file from Twitter. I have also tried referencing this locally which made no difference. I've also included the Javascript that I believe should hook-up the drop down menu and call into Twitter's Javascript file.

I'm at a loss as to why this isn't working

share|improve this question
add comment

2 Answers

up vote 11 down vote accepted

I can't see where you are including jQuery in your code. You have to include it before all your other scripts for the dropdown to work.

Here is the jQuery script from the google CDN:

share|improve this answer
Wonderful! That worked a treat. I did originally have the 1.5 jQuery script included but it seems like the 1.7 version is what is needed. I also changed the ordering in my header - I'm now including the CSS file and then the scripts because the other way round caused my navbar to split over 2 lines. Thanks for your help. –  Stu Feb 17 '12 at 20:03
add comment

Mind it is also redundant to use this code in your example:

    $(document).ready(function () {

Because it isn't doing anything.

share|improve this answer
add comment

Your Answer


