Jquery外掛程式Thickbox的使用指南

2022-03-14 03:22:38 字數 1225 閱讀 2241

首先在 html 檔案的 head中匯入jquery.js 和thickbox.js檔案,匯入 thickbox.css 檔案;並且jquery.js 檔案放在前面:

script>      script> 

a>  //只需要指定的class為thickbox

彈出框使用方法: 第三方物流

//內嵌內容  顯示隱藏內容a>  //遮罩層  url後面加?keepthis=true&tb_iframe=true&height=400&width=600  引數字串中加 modal=true  ?keepthis=true&tb_iframe=true&height=400&width=600&modal=true  這樣當關閉thickbox時會呼叫thickbox iframe (self.parent.tb_remove())內部的乙個tb_remove()函式  所有其他引數字元都必須在tb_iframe 引數之前。url中所有"tb" 之後的將被移除。  開啟乙個頁面a>    開啟乙個頁面a>  自定義設定:

1、彈出視窗(div)右上角的關閉按鈕為顯示為"close or esc key",而不是中文的; 如果想把它變成[x]或"關閉"應該怎麼來辦呢?

將thickbox.js檔案開啟,查詢關鍵字"or esc key",將其刪除,並將前面的close更改為[x]或"關閉",然後把檔案另存為utf-8格式,如果不儲存為utf-8的話

2、thickbox 彈出層的遮住層透明度修改

開啟thickbox.css查詢.tb_overlaybg 進行更改

.tb_overlaybg

onclick="self.parent.tb_remove();" 

外語屋4、關閉層重新整理父頁面,修改關閉方法 :

function tb_remove() );    $("#tb_load").remove();    if (typeof document.body.style.maxheight == "undefined") );        $("html").css("overflow","");    }    document.onkeydown = "";    document.onkeyup = "";    //重新整理父頁面,未指定    window.location.reload();    return false;}

5、thickbox外掛程式預設情況是點選灰色的遮罩層就會關閉取消

把兩個$("#tb_overlay").click(tb_remove);去掉就可以取消掉

jQuery外掛程式之日曆外掛程式

在頁面開發中,經常遇到需要使用者輸入日期的操作。通常的做法是,提供乙個文字框 text 讓使用者輸入,然後,編寫 驗證輸入的資料,檢測其是否是日期型別。這樣比較麻煩,同時,使用者輸入日期的操作也不是很方便,影響使用者體驗。如果使用jquery ui中的datepicker 日曆 外掛程式,這些問題都...

jQuery常用外掛程式 cookie外掛程式

使用cookie外掛程式後,可以很方便地通過cookie物件儲存 讀取 刪除使用者的資訊,還能通過cookie外掛程式儲存使用者的瀏覽記錄 1.語法 1 呼叫格式 cookie key,value,option 其中引數key為儲存cookie物件的名稱,value為名稱對應的cookie值。2 儲...

jQuery筆記(編寫jQuery外掛程式)

編寫jquery外掛程式,就等同與編寫乙個jquery物件的方法。給jquery物件繫結方法是通過擴充套件 fn物件實現的。如編寫乙個改變樣式的外掛程式 fn.makecolor function options 注 一定要留意return this,這表示可以繼續鏈式使用下去 同時還要留意這裡的t...