首頁 >web前端 >Bootstrap教程 >bootstrap插件有哪些

bootstrap插件有哪些

(*-*)浩
(*-*)浩原創
2019-07-18 10:13:075426瀏覽

Bootstrap自備12 jQuery插件,擴展了功能,可以為網站添加更多的互動。 即使您不是高階的 JavaScript 開發人員,您也可以著手學習 Bootstrap 的 JavaScript 外掛程式。

bootstrap插件有哪些

利用 Bootstrap 資料 API(Bootstrap Data API),大部分的外掛程式可以在不寫任何程式碼的情況下被觸發。 (推薦學習:Bootstrap影片教學

過渡效果(Transition)外掛程式提供了簡單的過渡效果。

Transition.js 是 transitionEnd 事件和 CSS 過渡效果模擬器的基本幫助器類別。它被其他插件用來檢查 CSS 過渡效果支持,並用來獲得過渡效果。

模態框(Modal)外掛程式

模態框(Modal)是覆蓋在父窗體上的子窗體。通常,目的是顯示來自單獨的來源的內容,可以在不離開父窗體的情況下有一些互動。子窗體可提供資訊、互動等。

下拉選單(Dropdown)插件

使用下拉式選單(Dropdown)插件,您可以向任何元件(例如導覽列、標籤頁、膠囊式導覽功能表、按鈕等)新增下拉式選單。

滾動監聽(Scrollspy)插件

滾動監聽(Scrollspy)插件,即自動更新導航插件,會根據捲軸的位置自動更新對應的導航目標。其基本的實作是隨著您的捲動,基於捲軸的位置會向導覽列添加 .active class。

標籤頁(Tab)外掛程式

標籤頁(Tab)透過結合一些 data 屬性,您可以輕鬆地建立一個標籤頁介面。透過這個外掛您可以把內容放置在標籤頁或是膠囊式標籤頁甚至是下拉式選單標籤頁中。

提示工具(Tooltip)外掛程式

當您想要描述一個連結的時候,提示工具(Tooltip)就顯得非常有用。提示工具(Tooltip)插件是受 Jason Frame 寫的 jQuery.tipsy 的啟發。提示工具(Tooltip)插件做了許多改進,例如不需要依賴圖像,而是改用 CSS 實現動畫效果,用 data 屬性儲存標題資訊。

彈出框(Popover)外掛程式

彈出框(Popover)與工具提示(Tooltip)類似,提供了擴充的視圖。如需啟動彈出框,使用者只需把滑鼠懸停在元素上即可。彈出框的內容完全可使用 Bootstrap 資料 API(Bootstrap Data API)來填入。此方法依賴工具提示(tooltip)。

警告框(Alert)外掛程式

警告框(Alert)訊息大多是用來向終端使用者顯示諸如警告或確認訊息的資訊。使用警告框(Alert)插件,您可以為所有的警告框訊息添加可取消(dismiss)功能。

按鈕(Button)外掛程式

按鈕(Button)在 Bootstrap 按鈕 一章中介紹過。透過按鈕(Button)插件,您可以添加進一些交互,例如控制按鈕狀態,或為其他元件(如工具列)建立按鈕組。

折疊(Collapse)外掛程式

折疊(Collapse)外掛程式可以輕鬆地讓頁面區域折疊起來。無論您用它來創建折疊導航還是內容面板,它都允許很多內容選項。

輪播(Carousel)外掛程式

Bootstrap 輪播(Carousel)外掛程式是一種靈活的響應式的向網站添加滑桿的方式。除此之外,內容也是足夠靈活的,可以是影像、內嵌框架、影片或其他您想要放置的任何類型的內容。

附加導覽(Affix)外掛程式

附加導覽(Affix)外掛程式允許指定

固定在頁面的某個位置。一個常見的例子是社交圖示。它們將在某個位置開始,但當頁面點擊某個標記,該
會鎖定在某個位置,不會隨著頁面其他部分一起滾動。

更多Bootstrap相關技術文章,請造訪Bootstrap教學欄位進行學習!

以上是bootstrap插件有哪些的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn