關於thickbox的一些問題解決

噁心的thickbox不更新了,遺留了一大堆兼容問題。於是,在項目中就遇到了。

1.有時候,點擊class="thickbox'的a標籤,彈出的thickbox會出現兩個iframe,於是,較好的解決方法是用span代替a標籤,然後加入點擊方法 tb_show(title,url) 這樣並解決了。據說a標籤有許多弊病,IE6中貌似更多(其中之一:先判斷的href,再判斷是否有click事件)。

2.定位問題,IE中惡心的定位,直接定位到下面。那是因爲js開頭的那個判斷只是判斷是否是IE6,其實IE中都會出現定位便宜的問題,於是修改後:

//on page load call tb_init
jQuery.browser.msie6 =
jQuery.browser.msie
&& /MSIE 6\.0/i.test(window.navigator.userAgent)
&& !/MSIE 7\.0/i.test(window.navigator.userAgent)
&& !/MSIE 8\.0/i.test(window.navigator.userAgent);

和後面的代碼

function tb_position() {
jQuery("#TB_window").css({marginLeft: '-' + parseInt((TB_WIDTH / 2),10) + 'px', width: TB_WIDTH + 'px'});
if ( !(jQuery.browser.msie6)) { // take away IE6
jQuery("#TB_window").css({marginTop: '-' + parseInt((TB_HEIGHT / 2),10) + 'px'});

}
}


3.url傳值問題:一般,你如果鏈接到一個url到action,並在後面加了param,是傳不過去後面的參數的,js裏面把參數提取並過濾掉了。需要修改,不讓它去掉?後面的參數。
4.還有其他諸如瀏覽圖片時,設置最小寬高,加入拖動功能等。。。。(暫未有需求改之)


//發現:IE6下,如果頁面要有左右滾動條的話,陰影無法覆蓋全部
解決:thickbox.css中

* html #TB_overlay { /* ie6 hack */
position: absolute;
height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
width: expression(document.body.scrollWidth > document.body.offsetWidth ? document.body.scrollWidth : document.body.offsetWidth + 'px');
}



噁心的IE6:再次發現。當有左右滾動條時,thickbox彈出位置偏離。於是小改代碼,如下

//針對IE6的修改===================================
if (window.ActiveXObject&&!window.XMLHttpRequest) {
var scLeft;
var swidth;
if (typeof window.pageXOffset != 'undefined') {
scLeft = window.pageYOffset; }
else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
scLeft = document.documentElement.scrollLeft; }
else if (typeof document.body != 'undefined') {
scLeft = document.body.scrollLeft; }

if(TB_WIDTH-scLeft>0){swidth= '-' + parseInt(( TB_WIDTH/2))}else{swidth='+' +(scLeft+TB_WIDTH/2)/2}
jQuery("#TB_window").css({marginLeft: swidth + 'px', width: TB_WIDTH + 'px'});
}



附上我改的js
發佈了64 篇原創文章 · 獲贊 0 · 訪問量 2751
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章