7

私はおそらくかなり小さなものが欠けていて、これを解決しようとして数時間ここに座っていたのでイライラしています。NavbarはJavascriptとリンクしません。ウィンドウのサイズが正しく変更されるとボタンが表示されますが、クリックしてもメニューは折りたたまれません。

ヘッダー内のリンクをすばやく確認します(順序が間違っている場合に備えて)

    <link rel="stylesheet" href="/assets/css/bootstrap.css">
<link rel="stylesheet" href="/assets/css/bootstrap-responsive.css">
<link rel="stylesheet" href="/assets/css/style.css?v=2">

<script src="/assets/js/bootstrap.js"></script>
<script src="/assets/js/bootstrap.min.js"></script>
<!-BootStrap--><script src="/assets/js/jquery-1.7.1.min.js"></script>
<script src="/assets/js/jquery.validate.min.js"></script>
<script src="/assets/js/script.js"></script>
<script src="/assets/js/bootstrap-fileupload.js"></script>

私のHTMLをざっと見てください-

<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
    <div class="container">
    <!--<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">-->
    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </a>
    <div class="span4">
        <a href="{site_url}" title="People Team">
        <img src="/assets/img/logo.png" alt="People Team Logo" />
        </a>
    </div>
    <nav>
        <div class="nav-collapse">
        <ul class="nav">
        <li{if segment_1 == ""} class="active"{/if}>
            <a href="/" title="Home">Home</a>
        </li>
        <li{if segment_1 == "services"} {/if}>
            <a href="/services" title="Contact People Team">Services</a>
        </li>
        <li{if segment_1 == "about"} {/if}>
            <a href="/about" title="About People Team">About the team</a>
        </li>
        <li{if segment_1 == "contact"} {/if}>
            <a href="/contact" title="Contact People Team">Contact Us</a>
        </li>
        </ul>   
    </div>

Javascriptは、ナビゲーションバーが機能するために必要なBootstrap.min.jsまたはBootstrap.jsファイル内にあると想定しました。私はちょうど困惑しています。どんな助けでもいただければ幸いです。

乾杯、

4

1 に答える 1

5

JSが読み込まれる順序を変更します。最初にjQuery、次にブートストラッププラグイン。

<script src="/assets/js/jquery-1.7.1.min.js"></script>
<script src="/assets/js/bootstrap.js"></script>  -- remove, as it is not really needed when including the minified version
<script src="/assets/js/bootstrap.min.js"></script>
于 2012-09-10T01:37:50.223 に答える