ИТ Блог. Создание сайтов с применением Bootstrap
(1 оценок, среднее: 5,00 из 5)
Загрузка...
Рассмотренная в предыдущих главах оформления компонентов являются только началом. Bootstrap поставляется в комплекте с 12 плагинами JQuery, которые расширяют возможности и могут добавить больше взаимодействия на вашем сайте. Для того, чтобы начать работу с плагинами JavaScript в Bootstrap, не обязательно быть опытным разработчиком на JavaScript. Используя Bootstrap Data API, большинство плагинов могут быть вызвано не написав ни одной строчки кода.
Плагины Bootstrap могут быть включены на сайте в двух формах:
Все плагины зависят от JQuery. Так что JQuery должен быть включен перед файлом плагина.
$(document).off('.data-api')
$(document).off('.alert.data-api')
Разработчики Bootstrap считают, что вы должны в состоянии использовать все плагины чисто через API JavaScript. Все открытые интерфейсы являются одиночными, змеевидными методами и вернуть коллекцию можно скажем так, к примеру:
$(".btn.danger").button("toggle").addClass("fat")
Все методы принимают объект необязательных опций, строку, которая предназначается для конкретного метода, или ничего (который инициирует плагин с поведением по умолчанию), как показано ниже:
// инициализируется по умолчанию
$("#myModal").modal()
// Тип клавиатуры
$("#myModal").modal({ keyboard: false })
// инициализирует, запускает и сразу показывает
$("#myModal").modal('show')
Каждый плагин также предоставляет свой необработанный конструктор в свойстве Constructor: $.fn.popover.Constructor. Если вы хотите получить конкретный экземпляр плагина, получить его непосредственно из элемента:
$('[rel = popover]').data('popover').
Bootstrap плагины иногда могут использоваться с другими системами пользовательского интерфейса. В этих условиях, может иногда возникать столкновение пространства имен. Для того, чтобы преодолеть это, вызывается .noConflict на плагин, который вы хотите, чтобы вернул значение.
// возврат $.fn.button на ранее присвоенное значение var bootstrapButton = $.fn.button.noConflict() // отдать $().bootstrapBtn начальную функциональность загрузки $.fn.bootstrapBtn = bootstrapButton
Bootstrap предоставляет пользовательские события для уникальных действий большинства плагина. Как правило, эти события в двух формах:
$('#myModal').on('show.bs.modal', function (e) {
// модальное окно перестает быть показано
if (!data) return e.preventDefault()
})
