-
彈出框--提示框和彈出框的異同 彈出框中HTML自定義的 data 屬性和提示框中的自定義的 data 屬性基本相同，只不過在其基礎(chǔ)上增加了一個 data-content 屬性，用來設(shè)置彈出框的內(nèi)容。其實(shí)兩插件也有略微的不同： 1.提示框 tooltip 的默認(rèn)觸發(fā)事件是 hover 和 focus，而彈出框 popover 是 click 2.提示框 tooltip 只有一個內(nèi)容(title)，而彈出框不僅可以設(shè)置標(biāo)題（title）還可以設(shè)置內(nèi)容(content)查看全部
-
彈出框--觸發(fā)彈出框的方法 Bootstrap框架中觸發(fā)彈出框和提示框一樣不能直接通過HTML的自定義data屬性來觸發(fā)。需要依賴于JavaScript腳本。 $(function(){ $('[data-toggle="popover"]').popover(); }); 注意：上面這種方法注意要使用 data- 設(shè)置彈出框的屬性。 除此之外，也可以單獨(dú)指定一個元素，在該元素上調(diào)用提示框，并且可能通過JavaScript的各種參數(shù)來實(shí)現(xiàn)，無需定義一些data屬性查看全部
-
提示框--JS設(shè)置參數(shù)方法查看全部
-
提示框--其他的自定義屬性查看全部
-
提示框--JS觸發(fā)提示框方法: 最簡單的觸發(fā)方式如下： $(function(){ $('[data-toggle="tooltip"]').tooltip(); }); 除此之外，也可以單獨(dú)指定一個元素，在該元素上調(diào)用提示框，并且可能通過JavaScript的各種參數(shù)來實(shí)現(xiàn)，無需定義一些 data 屬性，如： $(function(){ $('#myTooltip').tooltip({ title:"我是一個提示框，我在頂部出現(xiàn)", placement:'top' }); });查看全部
-
提示框--結(jié)構(gòu) Bootstrap框架中的tooltip的插件提供了四種不同的風(fēng)格： 在Bootstrap框架中的提示框是用按鈕<button>標(biāo)簽或者鏈接<a>標(biāo)簽來制作 需要特別注意的是： 1、如果同時設(shè)置了 data-original-title 和 title 定義提示信息，那么 data-original-title 的優(yōu)先級要高于 title。只有 data-original-title 值為空時，才會取 title 的值做為提示信息的內(nèi)容。 2、Bootstrap框架中的提示框的觸發(fā)方式和前面介紹的插件略有不同。不能直接通過自定義的屬性 data- 來觸發(fā)。 $(function(){ $("[data-toggle='tooltip']").tooltip(); });查看全部
-
選項(xiàng)卡--JavaScript觸發(fā)方法 調(diào)用方法: 在每個鏈接的單擊事件中調(diào)用tab("show")方法，顯示對應(yīng)的標(biāo)簽面板內(nèi)容。 $(function(){ $("#myTab a").click(function(e){ e.preventDefault(); $(this).tab("show"); }); })查看全部
-
選項(xiàng)卡--膠囊式選項(xiàng)卡（nav-pills） 在Bootstrap除了可以讓 nav-tabs 具有選項(xiàng)卡的切換功能之外，還可以對膠囊式 nav-pills 導(dǎo)航也具有選項(xiàng)卡的功能。我們只需要將 nav-tabs 換成 nav-pills，另外關(guān)鍵一點(diǎn)是將 data-toggle="tab"換成data-toggle="pill"。查看全部
-
選項(xiàng)卡--為選擇卡添加fade樣式查看全部
-
選項(xiàng)卡--觸發(fā)切換效果 聲明式觸發(fā)選項(xiàng)卡需要滿足以下幾點(diǎn)要求： 1、選項(xiàng)卡導(dǎo)航鏈接中要設(shè)置 data-toggle="tab" 2、并且設(shè)置 data-target="對應(yīng)內(nèi)容面板的選擇符(一般是ID)"; 如果是鏈接的話，還可以通過 href="對應(yīng)內(nèi)容面板的選擇符(一般是ID)" 3、面板內(nèi)容統(tǒng)一放在 tab-content 容器中，而且每個內(nèi)容面板 tab-pane 都需要設(shè)置一個獨(dú)立的選擇符（最好是ID）與選項(xiàng)卡中的 data-target 或 href 的值匹配。查看全部
-
關(guān)鍵一點(diǎn)，選項(xiàng)卡中鏈接的錨點(diǎn)要與對應(yīng)的面板內(nèi)容容器的ID相匹配。查看全部
-
Bootstrap框架中的選項(xiàng)卡主要有兩部分內(nèi)容組成： 選項(xiàng)卡組件（也就是菜單組件），對應(yīng)的是 Bootstrap的 nav-tabs） 底部可以切換的選項(xiàng)卡面板，在 Bootstrap 中通常 tab-pane 來表示查看全部
-
滾動監(jiān)控器--在body中加監(jiān)控 除了這種方法之外，還可以直接在body上進(jìn)行滾動條監(jiān)控，此時要將滾動監(jiān)控器移到body上，而且導(dǎo)航nav一定要在body內(nèi)部。 在body內(nèi)部加入<body data-spy="scroll" data-target="#navbar-menu"> 導(dǎo)航條必須設(shè)置為頂部固定樣式（navbar-fixed-top）查看全部
-
聲明屬性觸發(fā)滾動監(jiān)控 為監(jiān)控對象設(shè)置被監(jiān)控的data屬性：data-spy="scroll"，指定監(jiān)控的導(dǎo)航條：data-target="#navbar-menu"。查看全部
-
滾動監(jiān)控器的設(shè)計查看全部
舉報
0/150
提交
取消