亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定

玩轉Bootstrap(JS插件篇)

  • $(function(){ $(".btn").click(function(){ $("#mymodal").modal("參數"); }); $('#mymodal').on('事件',function(){ alert("aaaaa")//我們的操作 }) }); 1.參數toggle與事件show.bs.modal或事件shown.bs.modal配合使用時,點擊按鈕先彈出alert中的提示,再顯示模態窗,點擊關閉alert不再顯示 2.參數toggle與事件hide.bs.modal或事件hidden.bs.modal配合使用時,點擊按鈕先彈出模態窗點擊關閉再彈出alert提示 3.參數show與事件show.bs.modal配合使用時,點擊按鈕先彈出alert提示再彈出模態窗,點擊關閉再次顯示alert提示 4.參數show與事件shown.bs.modal配合使用時,點擊按鈕先彈出alert提示再彈出模態窗,點擊關閉不再顯示alert提示 5.參數hide與事件hide.bs.modal配合使用時,點擊按鈕彈出alert提示,不再顯示模態窗 6.參數hide與事件hidden.bs.modal配合使用時,點擊按鈕沒有任何顯示
    查看全部
  • <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() 方法切換元素的可見狀態。 如果被選元素可見,則隱藏這些元素,如果被選元素隱藏,則顯示這些元素
    查看全部
  • 好好好好好好好好好好好好好好好好好好好好好好好好好
    查看全部
  • 急急急highhighhigh好好好好好
    查看全部
  • 將tabIndex賦值為-1,則在使用[Tab]鍵時,此元素被忽略。 在添加modal-lg/sm的父元素上也要添加bs-example-modal-lg/sm,不然模態彈出窗將無法顯示
    查看全部
  • 這節要注意逗號別忘了,用來隔開設置的參數!
    查看全部
  • 彈出框--提示框和彈出框的異同 從之前的學習可知,彈出框中HTML自定義的 data 屬性和提示框中的自定義的 data 屬性基本相同,只不過在其基礎上增加了一個 data-content 屬性,用來設置彈出框的內容。其實兩插件也有略微的不同: 提示框 tooltip 的默認觸發事件是 hover 和 focus,而彈出框 popover 是 click 提示框 tooltip 只有一個內容(title),而彈出框不僅可以設置標題(title)還可以設置內容(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>
    查看全部
  • 滾動監控器--滾動監控器的設計: 第一步:使用滾動監控器,首要的條件是在頁面中加載對應的插件。在這里你可以加載合并好的bootstrap.js或者其獨立的插件文件scrollspy.js 第二步:設計一個帶有下拉菜單的導航條。分別為導航條和下拉菜單項定義一個錨點鏈接,錨點分為“#blog”,“html”,“#css”,“#sass”,“#js”,“php”,“#about”。同時為導航條定義一個id值“navbar-menu”(id名稱可自由定義),方便滾動監控。 第三步:設計監控對象。這里將監控對象內容都放置在一個div名為scrollspy(這個類名可自由定義)的容器中,其中放了多個子內容框。每個子內容框有一個標題,而且每個標題的ID值與導航菜單項中的錨點鏈接名相對應,并且注意加入“data-target="#navbar-menu"”屬性(這個屬性值要與前面的nav標簽的id名稱保持一致) 第四步:為監控對象定義樣式,設置容器scrollspy大?。ㄔO置高度目的是為了產生垂直滾動條)。
    查看全部
  • tranisition
    查看全部
  • 除了這種方法之外,還可以直接在body上進行滾動條監控,此時要將滾動監控器移到body上,而且導航nav一定要在body內部。如下所示: <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> 注意:導航條必須設置為頂部固定樣式(navbar-fixed-top)。
    查看全部
  • 不過使用該參數,每次單擊都要兩次toggle,就會一直是一個不變的狀態。所以,一般情況下,使用示例中不帶參數的方法。就算你需要使用參數“toggle”,也建議使用jQuery的one方法: $(".dropdown-toggle").one("click",function(){ $(this).dropdown("toggle"); })
    查看全部
  • data-backdrop="static" data-keyboard="false"等屬性寫在 calss=“modal”標簽中
    查看全部
  • 默認情況之下,Bootstrap框架中以下組件使用了過渡動畫效果: 模態彈出窗(Modal)的滑動和漸變效果; 選項卡(Tab)的漸變效果; 警告框(Alert)的漸變效果; 圖片輪播(Carousel)的滑動效果。
    查看全部
  • 最簡單的觸發方式如下: $(function(){ $('[data-toggle="tooltip"]').tooltip(); });
    查看全部

舉報

0/150
提交
取消
課程須知
本課程適合具有一定前端基礎的人員,對HTML和CSS有一定的了解,對于定制Bootstrap的同學需要具備LESS和Sass基礎知識。
老師告訴你能學到什么?
1、使用JS自由控制Bootstrap中提供的組件。

微信掃碼,參與3人拼團

微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號

友情提示:

您好,此課程屬于遷移課程,您已購買該課程,無需重復購買,感謝您對慕課網的支持!