-
為監(jiān)控對(duì)象設(shè)置被監(jiān)控的data屬性:data-spy="scroll",指定監(jiān)控的導(dǎo)航條:data-target="#navbar-menu"。同時(shí)定義監(jiān)控過程中滾動(dòng)條偏移位置data-offset="60"。 如果導(dǎo)航里有下拉菜單,并且滾動(dòng)區(qū)域的內(nèi)容到達(dá)下拉菜單子項(xiàng)所對(duì)應(yīng)的區(qū)域,除了菜單高亮以外,子菜單的父元素dropdown也會(huì)高亮 【通過data-offset完美解決滾動(dòng)監(jiān)控效果同步問題】: 通過調(diào)節(jié)監(jiān)控過程中滾動(dòng)條偏移位置data-offset=""至合適的值可以使錨點(diǎn)出現(xiàn)時(shí)間和導(dǎo)航中對(duì)應(yīng)表項(xiàng)激活狀態(tài)時(shí)間一致!查看全部
-
《position屬性absolute與relative 詳解》:http://www.cnblogs.com/jenry/archive/2007/07/15/818660.html 【position屬性:absolute(絕對(duì)位置)與relative(相對(duì)位置)】 absolute:參照瀏覽器的左上角,配合TRBL進(jìn)行定位,在沒有設(shè)定TRBL,默認(rèn)依據(jù)父級(jí)的做標(biāo)原始點(diǎn)為原 始點(diǎn)。如果設(shè)定TRBL并且父級(jí)沒有設(shè)定position屬性,那么當(dāng)前的absolute則以瀏覽器左上角為原始點(diǎn)進(jìn)行定位,位置將由TRBL決定。 absolute:參照父級(jí)的原始點(diǎn)為原始點(diǎn),若沒有父級(jí)則以body的原始點(diǎn)為原始點(diǎn),配合TRBL進(jìn)行定位,當(dāng)父級(jí)內(nèi)有padding等CSS屬性時(shí),當(dāng)前級(jí)的原始點(diǎn)則參照父級(jí)內(nèi)容區(qū)的原始點(diǎn)進(jìn)行定位。 注:TRBL:Top、Right、Bottom、Left查看全部
-
.scrollspy-example的高度會(huì)影響效果: 過大,會(huì)導(dǎo)致滾動(dòng)時(shí)出現(xiàn)“跳躍”。 問:【滾動(dòng)監(jiān)視器在窗口的位置會(huì)不會(huì)影響效果?】查看全部
-
Hint.css 同樣可以提示 純css查看全部
-
右側(cè)代碼只是實(shí)現(xiàn)了【錨點(diǎn)跳轉(zhuǎn)功能】,但沒有實(shí)現(xiàn)【滾動(dòng)監(jiān)控器】功能,補(bǔ)充右側(cè)編輯器缺少的代碼以實(shí)現(xiàn)滾動(dòng)監(jiān)控器的功能。查看全部
-
多種可能有效的寫法(“可能有效”:因?yàn)榻Y(jié)果一樣,但怎么寫都隱藏不了) 【1】 $(function(){ $("#tutorial").click(function(){ $(".dropdown-menu").dropdown("toggle"); }); }); 【2】 $(function(){ $(".dropdown-toggle").one("click",function(){ $(this).dropdown("toggle"); }) })查看全部
-
和模態(tài)彈出窗一樣,Bootstrap框架中的下拉菜單也支持JavaScript方法觸發(fā)下拉菜單顯示。使用JavaScript觸發(fā)下拉菜單和聲明式原理是基本類似的,【不同的是】使用JavaScript方法可以按照自己的方式省略一些元素或者樣式。查看全部
-
<script> $(function(){ $(".btn").click(function(){ $("#mymodal").modal("toggle"); }); $('#mymodal').on('hidden.bs.modal', function(e){ // 處理代碼... alert("hello,windows!"); //關(guān)閉模態(tài)彈出窗時(shí),彈出警示框 }); }); </script>查看全部
-
事件設(shè)置: 模態(tài)彈出窗還支持四種類型的事件,分別是模態(tài)彈出窗的彈出前、彈出后,關(guān)閉前、關(guān)閉后,具體描述如下: 事件類型+描述: show.bs.modal 在show方法調(diào)用時(shí)立即觸發(fā)(尚未顯示之前);如果單擊了一個(gè)元素,那么該元素將作為事件的relatedTarget屬性 shown.bs.modal 該事件在模態(tài)彈出窗完全顯示給用戶之后(并且等CSS動(dòng)畫完成之后)觸發(fā);如果單擊了一個(gè)元素,那么該元素將作為事件的relatedTarget事件 hide.bs.modal 在hide方法調(diào)用時(shí)(但還未關(guān)閉隱藏)立即觸發(fā) hidden.bs.modal 該事件在模態(tài)彈出窗完全隱藏之后(并且CSS動(dòng)畫漂完成之后)觸發(fā)查看全部
-
參數(shù)設(shè)置: 在Bootstrap框架中還為模態(tài)彈出窗提供了三種參數(shù)設(shè)置,具體說明如下: 參數(shù) 使用方法 描述 toggle $(“#mymodal”).modal(“toggle”) 觸發(fā)時(shí),反轉(zhuǎn)模態(tài)彈出窗的狀態(tài)。如果模態(tài)彈出窗是顯示的,則關(guān)閉;反之,如果模態(tài)彈出窗是關(guān)閉的,則顯示 show $(“#mymodal”).modal(“show”) 觸發(fā)時(shí),顯示模態(tài)彈出窗 hide $(“#mymodal”).modal(“hide”) 觸發(fā)時(shí),關(guān)閉模態(tài)彈出窗查看全部
-
<script> $(function(){ $(".btn").click(function(){ $("#mymodal").modal({ show:true,keyboard:false,backdrop:false }); }); }); </script>查看全部
-
$在JS中本身只是一個(gè)符號(hào)而異,在JS里什么也不是。 但在JS應(yīng)用庫JQUERY的作者將之做為一個(gè)自定義函數(shù)名了,這個(gè)函數(shù)是獲取指定網(wǎng)頁元素的函數(shù),使用非常之頻繁,所以好多新手不知道,還以為$是JS的什么特殊語法。 后來,可能有些程序員JQUERY用得多了,發(fā)現(xiàn)$這個(gè)函數(shù)很好用,很方便,所以,在不用JQUERY的情況,一般自己也會(huì)自定義一個(gè)$函數(shù)。 即: function $(Nid){ return document.getElementById(Nid); } 就這么簡單(在JSQUERY里可能稍微功能再強(qiáng)大一點(diǎn),但主要還是我寫的這個(gè)功能。) 以后在網(wǎng)頁就不用每次使用document.getElementById("ID名")來獲取元素,只用$('ID名')即可,非常簡使了。查看全部
-
單獨(dú)導(dǎo)入: 為方便單獨(dú)導(dǎo)入特效文件,Bootstrap V3.2中提供了12種JavaScript插件,他們分別是: ? 動(dòng)畫過渡(Transitions):對(duì)應(yīng)的插件文件“transition.js” ? 模態(tài)彈窗(Modal):對(duì)應(yīng)的插件文件“modal.js” ? 下拉菜單(Dropdown):對(duì)應(yīng)的插件文件“dropdown.js” ? 滾動(dòng)偵測(cè)(Scrollspy):對(duì)應(yīng)的插件文件“scrollspy.js” ? 選項(xiàng)卡(Tab):對(duì)應(yīng)的插件文件“tab.js” ? 提示框(Tooltips):對(duì)應(yīng)的插件文件“tooltop.js” ? 彈出框(Popover):對(duì)應(yīng)的插件文件“popover.js” ? 警告框(Alert):對(duì)應(yīng)的插件文件“alert.js” ? 按鈕(Buttons):對(duì)應(yīng)的插件文件“button.js” ? 折疊/手風(fēng)琴(Collapse):對(duì)應(yīng)的插件文件“collapse.js” ? 圖片輪播Carousel:對(duì)應(yīng)的插件文件“carousel.js” ? 自動(dòng)定位浮標(biāo)Affix:對(duì)應(yīng)的插件文件“affix.js” 上述單獨(dú)插件的下載可到github去下載(https://github.com/twbs/bootstrap)。查看全部
-
perfect查看全部
-
加入JavaScript控件查看全部
舉報(bào)
0/150
提交
取消