-
<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">查看全部
-
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">查看全部
-
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>查看全部
-
filter: alpha(opacity=0);//兼容IE opacity: 0;//普適查看全部
-
aria-labelledby一般用在區(qū)域元素上,對于的id一般為對應(yīng)的標(biāo)題或是標(biāo)簽元素的id.關(guān)系型屬性。查看全部
-
在Bootstrap框架中為模態(tài)彈出窗也添加了一個這樣的蒙層樣式“modal-backdrop”,只不過他默認(rèn)情況下是全屏黑色的: /*bootstrap.css文件第5424行~第5432行*/ .modal-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040; background-color: #000; }查看全部
-
aria-labelledby="myModalLabel",該屬性引用模態(tài)框的標(biāo)題。查看全部
-
您可以切換模態(tài)框(Modal)插件的隱藏內(nèi)容: 通過 data 屬性:在控制器元素(比如按鈕或者鏈接)上設(shè)置屬性 data-toggle="modal",同時設(shè)置 data-target="#identifier" 或 href="#identifier" 來指定要切換的特定的模態(tài)框(帶有 id="identifier")。 通過 JavaScript:使用這種技術(shù),您可以通過簡單的一行 JavaScript 來調(diào)用帶有 id="identifier" 的模態(tài)框: $('#identifier').modal(options)查看全部
-
聲明式方法是通過定義 data 屬性來實現(xiàn),data 屬性可以很容易地控制輪播的位置。其主要包括以下幾種: data-ride 屬性:取值 carousel,并且將其定義在 carousel 上。 data-target 屬性:取值 carousel 定義的 ID 名或者其他樣式識別符,如前面示例所示,取值為“#slidershow”,并且將其定義在輪播圖計數(shù)器的每個 li 上。 data-slide 屬性:取值包括 prev,next,prev表示向后滾動,next 表示向前滾動。該屬性值同樣定義在輪播圖控制器的 a 鏈接上,同時設(shè)置控制器 href 值為容器 carousel 的 ID 名或其他樣式識別符。 data-slide-to 屬性:用來傳遞某個幀的下標(biāo),比如 data-slide-to="2",可以直接跳轉(zhuǎn)到這個指定的幀(下標(biāo)從0開始計),同樣定義在輪播圖計數(shù)器的每個 li 上。查看全部
-
注意:在這個案例中不加入data-target="#panel1"也可以,因為前面已經(jīng)有了href="#panel1",但如是button按鈕作為觸發(fā)器就必須使用data-target="#panel1"語句了。 第六步,定義data-parent屬性,實現(xiàn)點(diǎn)擊一個其中一個元素時,關(guān)閉所有的折疊區(qū),再打開所單擊的區(qū)域(如果所單擊區(qū)域是展示的,則會關(guān)閉)。這個data-parent取值與手風(fēng)琴面板容器的標(biāo)識符相匹配, 通過示例,我們可以看出以下幾點(diǎn): ? 使用 panel 的 panel-title 做為觸元素,使用panel-body的父元素作為折疊區(qū); ? 使用一個 panel-group 來包含多個 panel,從而實現(xiàn)手風(fēng)琴效果; ? 每個 panel 里的觸發(fā)元素都要指定data-parent屬性; ? data-parent 屬性的值對應(yīng) panel-group樣式元素的ID或者其他樣式標(biāo)識符; ? 觸發(fā)元素需要指定 data-toggle,并且值為 collapse; ? 觸發(fā)元素都要指定 data-target屬性; ? data-target屬性的值對應(yīng) panel-body 的父元素的ID或者其他樣式標(biāo)識符。查看全部
-
使用 data-toggle 屬性還可以激活按鈕的行為狀態(tài),實現(xiàn)在激活和未激活之間進(jìn)行狀態(tài)切換。例如,下面代碼可以激活按鈕行為特性,單擊時將按鈕激活,再單擊可以讓按鈕恢復(fù)到默認(rèn)狀態(tài): <button type="button" data-toggle="button" class="btn btn-primary">確認(rèn)</button>查看全部
-
彈出框--提示框和彈出框的異同 從之前的學(xué)習(xí)可知,彈出框中HTML自定義的 data 屬性和提示框中的自定義的 data 屬性基本相同,只不過在其基礎(chǔ)上增加了一個 data-content 屬性,用來設(shè)置彈出框的內(nèi)容。其實兩插件也有略微的不同: 提示框 tooltip 的默認(rèn)觸發(fā)事件是 hover 和 focus,而彈出框 popover 是 click 提示框 tooltip 只有一個內(nèi)容(title),而彈出框不僅可以設(shè)置標(biāo)題(title)還可以設(shè)置內(nèi)容(content) 兩個插件的顯示模板不同: 提示框tooltip的模板: <div class="tooltip" role="tooltip"> <div class="tooltip-arrow"></div> <div class="tooltip-inner"></div> </div> 彈出框popover的模板: <div class="popover" role="tooltip"> <div class="arrow"></div> <h3 class="popover-title"></h3> <div class="popover-content"></div> </div>查看全部
-
自定義結(jié)構(gòu)屬性查看全部
-
當(dāng)同一個按鈕既有提示框又有彈出框時的各屬性的設(shè)置。。。查看全部
-
按鈕: data-backdrop="static" 點(diǎn)擊背景不會關(guān)閉 data-keyboard="false"(modal + tabindex="-1") 按ESC不會關(guān)閉查看全部
舉報
0/150
提交
取消