Twitter Bootstrap 2, collapse-nav

С Twitter Bootstrap 2, как получить ссылки, работающие в collapse-nav:

<div class="navbar navbar-fixed-top">
  <div class="navbar-inner">
    <div class="container">
      <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>
      <a class="brand" href="/index.html">Hubsphere - Controller</a>
      <div class="nav-collapse">
        <ul class="nav">
          <li class="">
            <a href="./index.html">Overview</a>
          </li>
        </ul>
      </div>
    </div>
  </div>
</div>

У меня включен jquery и файл bootstrap-collapse.js.

Я пробовал называть $('.nav-collapse').collapse(), но это только открывает область коллапса и доза не активирует кнопку. это то, что я ожидал, поскольку он должен просто работать с разметкой.

спасибо

Ответы

Ответ 1

Мне было немного любопытно узнать, сохраняется ли эта проблема с bootstrap 2.0.4

На самом деле нет смысла включать и bootstrap.js и bootstrap-collapse.js, поскольку bootstrap.js включает bootstrap-collapse.js

только boostrap-collapse.js http://jsfiddle.net/baptme/YWUmb/6/

Он работает отлично, как ожидалось.

и boostrap.js и boostrap-collapse.js: http://jsfiddle.net/baptme/YWUmb/5/

Если вы нажмете кнопку свернуть в первый раз, div немедленно откроется и закрывается. (Я думаю, это потому, что плагин объявлен дважды).

И тогда он работает нормально.

Эта проблема специфична для ранней версии twitter boostrap (2.0.0), но она была рассмотрена или больше не возникает из-за изменения структуры плагина.

Ответ 2

Итак, моя проблема заключалась в том, что я включал bootstrap.js и bootstrap-collapse.js в том же файле, я предположил, что bootstrap.js необходимо, а затем, когда он не работает, я включил bootstrap-collapse.js.

Теперь мне очевидно, но bootstrap.js - это все загрузочные js файлы. Что приятно...

Ответ 3

Есть еще один случай, когда требуется файл bootstrap.css ПОСЛЕ bootstrap-responsive.css. Это также приведет к тому, что кнопка не появится. Перед загрузкой bootstrap-responsive.css обязательно загрузите bootstrap.css.

Ответ 4

Либо вы включаете полную загрузочную библиотеку jquery (которая хранит все js ко всем плагинам), либо вы включаете одну библиотеку.

Итак, например: если вы хотите использовать всплывающие подсказки, вы можете:

  • include: js/bootstrap.js(содержит все плагины)

или

  • include: bootstrap/js/bootstrap-tooltip.js

второй метод лучше, потому что вы не загружаете в браузер вещи, которые не будут использоваться!

Используйте версию LESS из github или скомпилируйте ее самостоятельно через собственный компилятор сайта bootstrap, никогда не используйте значение по умолчанию!