<!DOCTYPE html>
<html>
    <head>
        <title>HI THERE</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link href = "css/bootstrap.min.css" rel="stylesheet">
        <link href = "css/styles.css" rel = "stylesheet">
    </head>
    <body>
        <div class = "navbar navbar-inverse navbar-static-top">
            <div class = "container">
                <a href = "#" class = "navbar-brand">ABC</a>
                <button class = "navbar-toggle" data-toggle = "collapse" data-target = ".navHeaderCollapse">
                    BUTTON
                </button>   
                <div class = "collapse navbar-collapse navHeaderCollapse">
                    <ul class = "nav navbar-nav navbar-right">
                        <li class="active"><a href ="#">home</a></li>

                    </ul>

                </div>
            </div>
        </div>
        <script src = "http//code.jquery.com/jquery-1.10.2.min.js"></script>
        <script src = "js/bootstrap.js"></script>

    </body>

</html>

Oto mój kod do podejmowania podstawowego responsywnego zapadającego Navbar za pomocą Twitter Bootstrap. Dzwonię do przycisku "Przycisk" i chciałbym być widoczny, gdy ekran jest skompresowany. Po kliknięciu tego przycisku, chciałbym upuść się z linkiem "Home", a niektóre inne, kiedy dodam je później. Z jakiegoś powodu przycisk nie jest kaskadowy, gdy kompresuję ekran. Widzę tylko przycisk, ale kiedy go klikam, nie rozwinię się!

PS - Zgaduję, że jest to ładne podstawowe rzeczy dla wielu koderów na tej stronie, ale jeśli chcesz, żebym dodał wpisy komentarza do kodu, aby wyczyścić moją linię intencyjną według linii, po prostu daj mi znać, a ja bądź szczęśliwy, że to zrobi.

0
mobiustrip 10 grudzień 2013, 23:52

2 odpowiedzi

Najlepsza odpowiedź

Link, którego musisz jQuery, jest nieprawidłowy. Brakuje Ci: Po HTTP.

Tak jak w, powinien przeczytać:

<script src = "http://code.jquery.com/jquery-1.10.2.min.js"></script>

Ważna rzecz do sprawdzenia przed rozpoczęciem pracy nad funkcjonalnością jest upewnienie się, że wszystkie pliki CSS i JQuery są prawidłowo uwzględnione. Możesz to zrobić, otwierając konsolę w przeglądarce, jeśli jakiekolwiek zasoby zewnętrzne nie załadują, pojawi się błąd dotyczący tego.

Powodzenia.

1
Paul Haggo 10 grudzień 2013, 20:15

Twój kod wydaje się działać w porządku bez problemów, innych niż kolor przycisku. Spójrz na ten jsbin: http://jsbin.com/uyeyumo/3/edit

0
Steve H. 10 grudzień 2013, 20:04