-
<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ū)域元素上，對(duì)于的id一般為對(duì)應(yīng)的標(biāo)題或是標(biāo)簽元素的id.關(guān)系型屬性。查看全部
-
在Bootstrap框架中為模態(tài)彈出窗也添加了一個(gè)這樣的蒙層樣式“modal-backdrop”，只不過(guò)他默認(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)容： 通過(guò) data 屬性：在控制器元素（比如按鈕或者鏈接）上設(shè)置屬性 data-toggle="modal"，同時(shí)設(shè)置 data-target="#identifier" 或 href="#identifier" 來(lái)指定要切換的特定的模態(tài)框（帶有 id="identifier"）。 通過(guò) JavaScript：使用這種技術(shù)，您可以通過(guò)簡(jiǎn)單的一行 JavaScript 來(lái)調(diào)用帶有 id="identifier" 的模態(tài)框： $('#identifier').modal(options)查看全部
-
聲明式方法是通過(guò)定義 data 屬性來(lái)實(shí)現(xiàn)，data 屬性可以很容易地控制輪播的位置。其主要包括以下幾種： data-ride 屬性：取值 carousel，并且將其定義在 carousel 上。 data-target 屬性：取值 carousel 定義的 ID 名或者其他樣式識(shí)別符，如前面示例所示，取值為“#slidershow”，并且將其定義在輪播圖計(jì)數(shù)器的每個(gè) li 上。 data-slide 屬性：取值包括 prev，next，prev表示向后滾動(dòng)，next 表示向前滾動(dòng)。該屬性值同樣定義在輪播圖控制器的 a 鏈接上，同時(shí)設(shè)置控制器 href 值為容器 carousel 的 ID 名或其他樣式識(shí)別符。 data-slide-to 屬性：用來(lái)傳遞某個(gè)幀的下標(biāo)，比如 data-slide-to="2"，可以直接跳轉(zhuǎn)到這個(gè)指定的幀（下標(biāo)從0開始計(jì)），同樣定義在輪播圖計(jì)數(shù)器的每個(gè) li 上。查看全部
-
注意：在這個(gè)案例中不加入data-target="#panel1"也可以，因?yàn)榍懊嬉呀?jīng)有了href="#panel1"，但如是button按鈕作為觸發(fā)器就必須使用data-target="#panel1"語(yǔ)句了。 第六步，定義data-parent屬性，實(shí)現(xiàn)點(diǎn)擊一個(gè)其中一個(gè)元素時(shí)，關(guān)閉所有的折疊區(qū)，再打開所單擊的區(qū)域（如果所單擊區(qū)域是展示的，則會(huì)關(guān)閉）。這個(gè)data-parent取值與手風(fēng)琴面板容器的標(biāo)識(shí)符相匹配， 通過(guò)示例，我們可以看出以下幾點(diǎn)： ? 使用 panel 的 panel-title 做為觸元素，使用panel-body的父元素作為折疊區(qū)； ? 使用一個(gè) panel-group 來(lái)包含多個(gè) panel，從而實(shí)現(xiàn)手風(fēng)琴效果； ? 每個(gè) panel 里的觸發(fā)元素都要指定data-parent屬性； ? data-parent 屬性的值對(duì)應(yīng) panel-group樣式元素的ID或者其他樣式標(biāo)識(shí)符； ? 觸發(fā)元素需要指定 data-toggle，并且值為 collapse； ? 觸發(fā)元素都要指定 data-target屬性； ? data-target屬性的值對(duì)應(yīng) panel-body 的父元素的ID或者其他樣式標(biāo)識(shí)符。查看全部
-
使用 data-toggle 屬性還可以激活按鈕的行為狀態(tài)，實(shí)現(xiàn)在激活和未激活之間進(jìn)行狀態(tài)切換。例如，下面代碼可以激活按鈕行為特性，單擊時(shí)將按鈕激活，再單擊可以讓按鈕恢復(fù)到默認(rèn)狀態(tài)： <button type="button" data-toggle="button" class="btn btn-primary">確認(rèn)</button>查看全部
-
彈出框--提示框和彈出框的異同 從之前的學(xué)習(xí)可知，彈出框中HTML自定義的 data 屬性和提示框中的自定義的 data 屬性基本相同，只不過(guò)在其基礎(chǔ)上增加了一個(gè) data-content 屬性，用來(lái)設(shè)置彈出框的內(nèi)容。其實(shí)兩插件也有略微的不同： 提示框 tooltip 的默認(rèn)觸發(fā)事件是 hover 和 focus，而彈出框 popover 是 click 提示框 tooltip 只有一個(gè)內(nèi)容(title)，而彈出框不僅可以設(shè)置標(biāo)題（title）還可以設(shè)置內(nèi)容(content) 兩個(gè)插件的顯示模板不同： 提示框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)同一個(gè)按鈕既有提示框又有彈出框時(shí)的各屬性的設(shè)置。。。查看全部
-
按鈕： data-backdrop="static" 點(diǎn)擊背景不會(huì)關(guān)閉 data-keyboard="false"（modal + tabindex="-1"） 按ESC不會(huì)關(guān)閉查看全部
舉報(bào)
0/150
提交
取消