-
$(function(){ $(".btn").click(function(){ $("#mymodal").modal("參數(shù)"); }); $('#mymodal').on('事件',function(){ alert("aaaaa")//我們的操作 }) }); 1.參數(shù)toggle與事件show.bs.modal或事件shown.bs.modal配合使用時(shí)，點(diǎn)擊按鈕先彈出alert中的提示，再顯示模態(tài)窗，點(diǎn)擊關(guān)閉alert不再顯示 2.參數(shù)toggle與事件hide.bs.modal或事件hidden.bs.modal配合使用時(shí)，點(diǎn)擊按鈕先彈出模態(tài)窗點(diǎn)擊關(guān)閉再?gòu)棾鯽lert提示 3.參數(shù)show與事件show.bs.modal配合使用時(shí)，點(diǎn)擊按鈕先彈出alert提示再?gòu)棾瞿B(tài)窗，點(diǎn)擊關(guān)閉再次顯示alert提示 4.參數(shù)show與事件shown.bs.modal配合使用時(shí)，點(diǎn)擊按鈕先彈出alert提示再?gòu)棾瞿B(tài)窗，點(diǎn)擊關(guān)閉不再顯示alert提示 5.參數(shù)hide與事件hide.bs.modal配合使用時(shí)，點(diǎn)擊按鈕彈出alert提示，不再顯示模態(tài)窗 6.參數(shù)hide與事件hidden.bs.modal配合使用時(shí)，點(diǎn)擊按鈕沒有任何顯示查看全部
-
<div class="modal fade " id="mymodal"> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script src="http://cdn.bootcss.com/bootstrap/2.3.1/js/bootstrap-transition.js"></script> <script src="http://cdn.bootcss.com/bootstrap/2.3.1/js/bootstrap-modal.js"></script>查看全部
-
$(function(){ $(".btn").click(function(){ $("#mymodal").modal("toggle"); }); }); toggle() 方法切換元素的可見狀態(tài)。 如果被選元素可見，則隱藏這些元素，如果被選元素隱藏，則顯示這些元素查看全部
-
好好好好好好好好好好好好好好好好好好好好好好好好好查看全部
-
急急急highhighhigh好好好好好查看全部
-
將tabIndex賦值為-1，則在使用[Tab]鍵時(shí)，此元素被忽略。 在添加modal-lg/sm的父元素上也要添加bs-example-modal-lg/sm，不然模態(tài)彈出窗將無法顯示查看全部
-
這節(jié)要注意逗號(hào)別忘了，用來隔開設(shè)置的參數(shù)！查看全部
-
彈出框--提示框和彈出框的異同 從之前的學(xué)習(xí)可知，彈出框中HTML自定義的 data 屬性和提示框中的自定義的 data 屬性基本相同，只不過在其基礎(chǔ)上增加了一個(gè) data-content 屬性，用來設(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>查看全部
-
滾動(dòng)監(jiān)控器--滾動(dòng)監(jiān)控器的設(shè)計(jì): 第一步：使用滾動(dòng)監(jiān)控器，首要的條件是在頁(yè)面中加載對(duì)應(yīng)的插件。在這里你可以加載合并好的bootstrap.js或者其獨(dú)立的插件文件scrollspy.js 第二步：設(shè)計(jì)一個(gè)帶有下拉菜單的導(dǎo)航條。分別為導(dǎo)航條和下拉菜單項(xiàng)定義一個(gè)錨點(diǎn)鏈接，錨點(diǎn)分為“#blog”,“html”,“#css”,“#sass”,“#js”,“php”,“#about”。同時(shí)為導(dǎo)航條定義一個(gè)id值“navbar-menu”（id名稱可自由定義），方便滾動(dòng)監(jiān)控。 第三步：設(shè)計(jì)監(jiān)控對(duì)象。這里將監(jiān)控對(duì)象內(nèi)容都放置在一個(gè)div名為scrollspy（這個(gè)類名可自由定義）的容器中，其中放了多個(gè)子內(nèi)容框。每個(gè)子內(nèi)容框有一個(gè)標(biāo)題，而且每個(gè)標(biāo)題的ID值與導(dǎo)航菜單項(xiàng)中的錨點(diǎn)鏈接名相對(duì)應(yīng)，并且注意加入“data-target="#navbar-menu"”屬性（這個(gè)屬性值要與前面的nav標(biāo)簽的id名稱保持一致） 第四步：為監(jiān)控對(duì)象定義樣式，設(shè)置容器scrollspy大?。ㄔO(shè)置高度目的是為了產(chǎn)生垂直滾動(dòng)條）。查看全部
-
tranisition查看全部
-
除了這種方法之外，還可以直接在body上進(jìn)行滾動(dòng)條監(jiān)控，此時(shí)要將滾動(dòng)監(jiān)控器移到body上，而且導(dǎo)航nav一定要在body內(nèi)部。如下所示： <body data-spy="scroll" data-target="#navbar-menu"> <div class="navbar navbar-default navbar-fixed-top" id="navbar-menu"> </div> <h3 id="blog">Blog</h3> <p>…</p> </body> 注意：導(dǎo)航條必須設(shè)置為頂部固定樣式（navbar-fixed-top）。查看全部
-
不過使用該參數(shù)，每次單擊都要兩次toggle，就會(huì)一直是一個(gè)不變的狀態(tài)。所以，一般情況下，使用示例中不帶參數(shù)的方法。就算你需要使用參數(shù)“toggle”，也建議使用jQuery的one方法： $(".dropdown-toggle").one("click",function(){ $(this).dropdown("toggle"); })查看全部
-
data-backdrop="static" data-keyboard="false"等屬性寫在 calss=“modal”標(biāo)簽中查看全部
-
默認(rèn)情況之下，Bootstrap框架中以下組件使用了過渡動(dòng)畫效果： 模態(tài)彈出窗（Modal）的滑動(dòng)和漸變效果； 選項(xiàng)卡（Tab）的漸變效果； 警告框（Alert）的漸變效果； 圖片輪播（Carousel）的滑動(dòng)效果。查看全部
-
最簡(jiǎn)單的觸發(fā)方式如下： $(function(){ $('[data-toggle="tooltip"]').tooltip(); });查看全部
舉報(bào)
0/150
提交
取消