Menu rozwijane z Twitter Bootstrap

Kontynuując od this question, wciąż zmagam się z Bootstrap na Twitterze. Udało mi się wyświetlić pasek nawigacji i próbuję dodać do niego rozwijane menu. Bez względu na to, co próbuję, nie mogę dostać rozwijanej części menu do pracy! Oto zrzut ekranu mojego menu.Menu rozwijane z Twitter Bootstrap

navigation bar

Jak widać, mam „Ustawienia konta”, które powinny być rozwijane menu, ale po kliknięciu na nią, nie rozwijana opcji pojawiają. Poniżej znajduje się mój kod:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>@ViewBag.Title</title> 

    <script src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script> 
    <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() { 
      $('.dropdown-toggle').dropdown(); 
     }); 
    </script> 

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

</head> 
<body> 
    <div class="navbar"> 
     <div class="navbar-inner"> 
      <div class="container"> 
       <ul class="nav"> 
        <a class="brand" href="#">Present Ideas</a> 
        <li class="active"><a href="#">Home</a></li> 
        <li><a href="#">Blog</a></li> 
        <li><a href="#">About</a></li> 
        <li><a href="#">Help</a></li> 
        <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="#">Login</a></li> 
          <li><a href="#">Register</a></li> 
          <li class="divider"></li> 
          <li><a href="#">Logout</a></li> 
         </ul> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </div> 
    <div class="container-fluid"> 
     @RenderBody() 
    </div> 
</body> 
</html>

Jak widać, odwołuję się do rozwijanego pliku Javascript z Twittera. Próbowałem również odnieść się do tego lokalnie, co nie miało znaczenia. Dodałem także kod JavaScript, który, jak sądzę, powinien połączyć rozwijane menu i wywołać plik JavaScript na Twitterze.

Jestem w rozterce, dlaczego to nie działa

Źródło

2012-02-17 Stu

nie widzę, gdzie jesteś w tym jQuery w kodzie. Musisz dodać go przed wszystkimi innymi skryptami, aby menu rozwijane działało.

Oto skrypt jQuery z Google CDN:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

Źródło

2012-02-17 19:20:44

Cudownie! To sprawiło przyjemność. Pierwotnie miałem dołączony skrypt 1.5 jQuery, ale wygląda na to, że potrzebna jest wersja 1.7. Zmieniłem także kolejność w moim nagłówku - teraz dołączam plik CSS, a następnie skrypty, ponieważ odwrotnie, mój navbar podzielił się na 2 linie. Dzięki za pomoc. – Stu

umysł jest także zbędne użyć tego kodu w Twojej przykładzie:

<script type="text/javascript" language="javascript" > 
    $(document).ready(function() { 
      $('.dropdown-toggle').dropdown(); 
    }); 
</script>

Bo to nie robi nic.

Źródło

2012-04-24 10:12:16

Odpowiedz

Powiązane problemy