這篇文章介紹了Javascript 遮罩層和加載效果代碼
有需要的朋友可以參考一下
復制代碼 代碼如下:
//loading
function showLoad(tipInfo) {
var iWidth = ; //彈出窗口的寬度;
var iHeight = ; //彈出窗口的高度;
var scrolltop = ;
var scrollleft = ;
var cheight = ;
var cwidth = ;
var eTip = documentcreateElement(div);
eTipsetAttribute(id tipDiv);
eTipstyleposition = absolute;
eTipstyledisplay = none;
eTipstyleborder = solid px #DDD;
eTipstylebackgroundColor = #BD;
eTipstylepadding = px px;
if(documentbodyscrollTop){//這是一個js的兼容
scrollleft=documentbodyscrollLeft;
scrolltop=documentbodyscrollTop;
cheight=documentbodyclientHeight;
cwidth=documentbodyclientWidth;
}
else{
scrollleft=documentdocumentElementscrollLeft;
scrolltop=documentdocumentElementscrollTop;
cheight=documentdocumentElementclientHeight;
cwidth=documentdocumentElementclientWidth;
}
iHeight = eTipoffsetHeight;
var v_left=(cwidthiWidth)/ + scrollleft; //
var v_top=(cheightiHeight)/+ scrolltop;
eTipstyleleft = v_left + px;
eTipstyletop = v_top + px;
eTipinnerHTML = <img src=Images/loadinggif style=float:left; /> <span style=color:#ffffff; fontsize:px> + tipInfo + </span>;
try {
documentbodyappendChild(eTip);
} catch (e) { }
$("#tipDiv")css("float" "right");
$("#tipDiv")css("zindex" "");
$(#tipDiv)show();
ShowMark();
}
function closeLoad() {
$(#tipDiv)hide();
HideMark();
}
//顯示蒙灰層
function ShowMark() {
var xp_mark = documentgetElementById("xp_mark");
if (xp_mark != null) {
//設置DIV
xp_markstyleleft = + "px";
xp_markstyletop = + "px";
xp_markstyleposition = "absolute";
xp_markstylebackgroundColor = "#";
xp_markstylezIndex = "";
if (documentall) {
xp_markstylefilter = "alpha(opacity=)";
var Ie_ver = navigator["appVersion"]substr( );
if (Ie_ver == || Ie_ver == ) { hideSelectBoxes(); }
}
else { xp_markstyleopacity = ""; }
xp_markstylewidth = "%";
xp_markstyleheight = "%";
xp_markstyledisplay = "block";
}
else {
//頁面添加div explainDiv注意必須是緊跟body 內的第一個元素否則IE不正常
$("body")prepend("<div id=xp_mark style=display:none;></div>");
ShowMark(); //繼續回調自己
}
}
//隱藏蒙灰層
function HideMark() {
var xp_mark = documentgetElementById("xp_mark");
xp_markstyledisplay = "none";
var Ie_ver = navigator["appVersion"]substr( );
if (Ie_ver == || Ie_ver == ) { showSelectBoxes(); }
}
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19984.html
