亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

百度Popup.js彈出框進(jìn)化版 拖拽小框架發(fā)布 兼容IE6/7/8,Firefox,Chrome

 更新時(shí)間：2010年04月13日 19:20:18   作者：  
百度空間的彈出窗口和拖拽效果(也就是popup.js),代碼精簡(jiǎn)，效果也很好，我們可以在很多大型網(wǎng)站上見(jiàn)到這種效果，在我的項(xiàng)目中也使用了該js。
腳本之家之前發(fā)布過(guò)這樣的代碼，其實(shí)問(wèn)題不大，但這里的版本主要是增加一些功能，回調(diào)執(zhí)行服務(wù)器端的方法，對(duì)于asp.net開(kāi)發(fā)或ajax開(kāi)發(fā)都是非常有價(jià)值的改進(jìn)。
先看下效果圖：


原有百度的Popup.js在有
復(fù)制代碼 代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

聲明的網(wǎng)頁(yè)下存在兼容性問(wèn)題，即在IE6,7,8下，遮罩層是可以全屏，但在Firefox和Chrome下無(wú)法全屏遮罩。
　　造成遮罩層在FF和Chrome下無(wú)法全屏的問(wèn)題在267行：
復(fù)制代碼 代碼如下:
var C = '<div id="dialogBoxBG" style="position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:' + A + ";" + H + "background-color:" + this.color.cColor + ';display:none;"></div>';

遮罩層dialogBoxBG 的style只是單純的設(shè)置為height:100%，所以在有<!DOCTYPE...>聲明下的頁(yè)面無(wú)法兼容FF和Chrome。
然而目前網(wǎng)上有一個(gè)“l(fā)uocheng”的“完美版”popup.js，下載下來(lái)試用了下，結(jié)果并沒(méi)有完全兼容FF和Chrome，還是存在遮罩層無(wú)法全屏的bug，讀了一下源代碼，找到了錯(cuò)誤所在：luocheng的版本中增加了一個(gè)getValue方法，switch語(yǔ)句中的case "clientHeight":竟然有兩個(gè)！刪掉一個(gè)以后繼續(xù)測(cè)試，還是無(wú)法兼容FF和Chrome，繼續(xù)讀代碼排錯(cuò)，增加的setBackgroundSize方法中G('dialogBoxBG').style.height = getValueHeight;只是復(fù)制給遮罩層dialogBoxBG的height=整數(shù)值，這個(gè)是不遵循web標(biāo)準(zhǔn)的，所以在FF和Chrome下存在bug。
復(fù)制代碼 代碼如下:

setBackgroundSize: function() {
var getValueWidth;
var getMaxValueWidth = [getValue("clientWidth"), getValue("scrollWidth")];
getValueWidth = eval("Math.max(" + getMaxValueWidth.toString() + ")");
G('dialogBoxBG').style.width = getValueWidth;
var getValueHeight;
var getMaxValueHeight = [getValue("clientHeight"), getValue("scrollHeight")];
getValueHeight = eval("Math.max(" + getMaxValueHeight.toString() + ")");
G('dialogBoxBG').style.height = getValueHeight; },

解決方法很簡(jiǎn)單：G('dialogBoxBG').style.height = getValueHeight;修改成G('dialogBoxBG').style.height = getValueHeight + "px";即可。
所以大家以后在開(kāi)發(fā)過(guò)程中，注意對(duì)于寬度與高度最好加上'px';這樣的單位。

令附上獲取頁(yè)面高度在不同瀏覽器之間的差異參考資料：
　　clientHeight：在IE和FF下，該屬性沒(méi)什么差別，都是指瀏覽器的可視區(qū)域，即除去瀏覽器的那些工具欄狀態(tài)欄剩下的頁(yè)面展示空間的高度；
　　scrollHeight：在IE下，scrollHeight 是頁(yè)面實(shí)際內(nèi)容的高度，可以小于clientHeight；在FF下，scrollHeight 是網(wǎng)頁(yè)內(nèi)容高度，不過(guò)最小值是clientHeight。
/*******************************************************/
拓展方法：
1.彈出確認(rèn)框回調(diào)執(zhí)行服務(wù)器端方法
復(fù)制代碼 代碼如下:

function ShowConfirm(title, content, target) //顯示確認(rèn)對(duì)話框
{
var pop = new Popup({
contentType: 3,
isReloadOnClose: false,
width: 350,
height: 110
});
pop.setContent("title", title);
pop.setContent("confirmCon", content);
pop.setContent("callBack", ShowCallBackServer); //回調(diào)函數(shù)
pop.setContent("parameter", {
id: "divCall",
str: target,
obj: pop
});
pop.build();
pop.show();
popp = pop;
return false;
}
//執(zhí)行服務(wù)器端方法，即進(jìn)行__doPostBack('','')操作
function ShowCallBackServer(para) {
var str = para["str"];
if ("" != str && null != str) {
str = GetEachBtnName(str);
if ("" != str && null != str) {
//alert(str);
__doPostBack(str, '');
}
}
ClosePop();
}
//遍歷頁(yè)面中的Button名稱
function GetEachBtnName(obj) {
return obj.name == '' || obj.name == null ? obj.id : obj.name;
}

使用方法：
　　在一個(gè)有OnClick="btnTest_Click" 的Button控件上注冊(cè)O(shè)nClientClick為return ShowConfirm(' ','是否確定刪除？',this)。
完整代碼：
復(fù)制代碼 代碼如下:
<asp:Button ID="btnDel" runat="server" Text="刪除" OnClick="btnDel_Click" OnClientClick="return ShowConfirm(' ','是否確定刪除？',this)" />

2.在iframe中使用popup.js
我們?cè)谝粋€(gè)頁(yè)面中內(nèi)嵌了一個(gè)iframe，想讓iframe中彈出的對(duì)話框或者確認(rèn)框在父頁(yè)面中彈出來(lái)，實(shí)現(xiàn)遮罩層全屏而不是只是在iframe頁(yè)面中全屏，然后確認(rèn)后執(zhí)行回調(diào)操作iframe，可以是執(zhí)行iframe中的服務(wù)器端方法。
復(fù)制代碼 代碼如下:

function ShowConfirmIFrame(title, content, target) //顯示確認(rèn)對(duì)話框
{
var pop = new Popup({
contentType: 3,
isReloadOnClose: false,
width: 350,
height: 110
});
pop.setContent("title", title);
pop.setContent("confirmCon", content);
pop.setContent("callBack", ShowIFrame); //回調(diào)函數(shù)
pop.setContent("parameter", {
id: "divCall",
str: target,
obj: pop
});
temp = target;
pop.build();
pop.show();
popp = pop;
return false;
}
var temp;
function ShowIFrame() {
parent.frames["content"].window.ShowCallBackServerIFrame(temp);
// parent.window.iframe.ShowCallBackServer();
}
function ShowCallBackServerIFrame(para) {
var str = para;
if ("" != str && null != str) {
str = GetEachBtnName(str);
if ("" != str && null != str) {
__doPostBack(str, '');
}
}
closeWin();
}

使用方法：
iframe中定義js方法：
復(fù)制代碼 代碼如下:

　　 //刪除
function subDel(obj)
{
return parent.parentDel(obj);
}

Button按鈕控件注冊(cè)O(shè)nClientClick事件：
復(fù)制代碼 代碼如下:
<asp:Button ID="btnDel" runat="server" OnClick="btnDel_Click" ToolTip="刪除" CssClass="deleteBtn" OnClientClick="return subDel(this);return false;" />

父頁(yè)面定義js方法：
復(fù)制代碼 代碼如下:

function parentDel(obj)
{
return ShowConfirmIFrame('刪除','是否確定刪除？',obj);
}

popup.js進(jìn)化版與普通修正版下載  原版也修正了上面所說(shuō)的并沒(méi)有完全兼容FF和Chrome的問(wèn)題。

相關(guān)文章

最新評(píng)論