Как заставить твиттер -начальные элементы JQUERY (подсказка, поп -невер и т. Д.)?

Question

Я играл с тестовой страницей Bootstrap в Twitter в DreamWeaver, и я абсолютно не могу получить какую -либо попвер, подсказка или другую загрузку JQUERY Goodie. Я скопировал код со страницы демонстрации, вылил исходный код, имел прямые ссылки на все правильные файлы JavaScript и все еще ничего. CSS работает нормально, хотя ни одна из анимации.

Демо -страница упоминает этот код для чего -то:

$('#example').popover(options)

Но я понятия не имею, что делать с чем -то подобным, потому что я не видел ничего подобного ни на одном рабочем сайте.

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

РЕДАКТИРОВАТЬ

Я нашел следующий фрагмент кода после публикации этого:

$(document).ready(function() {
    $("a[rel=popover]")
        .popover({
            offset: 10
        })
        .click(function(e) {
            e.preventDefault()
        })
});

И это заставило попверскую работу! Я никогда не видел ничего подобного в исходном коде ни одного из рабочих сайтов, которые я видел. Очень желаю, чтобы документация Bootstrap могла сделать эту крошечную деталь немного более ясной для новых пользователей JQUERY, таких как я.

Answer 1

Вам необходимо указать идентификатор или класс для элемента, который вы хотите отобразить, когда он падает. Вот пример:

<div id="example">Some element</div>

<script>
  $('#example').popover({
    title: 'A title!',
    content: 'Some content!' 
  })
</script>

Answer 2

Для людей приезжают сюда из Google:

Вы можете получить подсказку и Popover автоматически, как и другие плагины Bootstrap со следующим кодом:

<script type="text/javascript">
    $(function () {
        $('body').popover({
            selector: '[data-toggle="popover"]'
        });

        $('body').tooltip({
            selector: 'a[rel="tooltip"], [data-toggle="tooltip"]'
        });
    });
</script>

Затем вы можете использовать атрибуты данных, как обычно:

<a rel="tooltip" title="My tooltip">Link</a>
<a data-toggle="popover" data-content="test">Link</a>
<button data-toggle="tooltip" data-title="My tooltip">Button</button>

Это то, что означают документы Bootstrap, когда говорится, что Data-API для этих плагинов «выбирают».

Answer 3

Если вам нужна подсказка для начальной загрузки, тогда:

    $(function () {
        $("[rel='tooltip']").tooltip();
    });

Если вы хотите jQuery Putp Toolp, то:

    /*** Handle jQuery plugin naming conflict between jQuery UI ***/
$.widget.bridge('uitooltip', $.ui.tooltip);

    $(function () {
        $("[rel='tooltip']").uitooltip();
    });

HTML останется одинаковым в обоих случаях:

  <div title="Tooltip text" rel="tooltip"> div data ... </div>