閒來無事，把項目裡很土的彈窗，改成了遮罩層顯示，感覺效果好點了。上代碼：
父頁面： 代碼如下: <div id='newDiv1' style="display: none;"> <%@include file='/WEB-INF/jsp/infobackup/martyr/printCertDia.jsp' %> <%--<jsp:include page="/WEB-INF/jsp/infobackup/martyr/printCertDia.jsp" flush=”true”/> --%> </div> printCertDia.jsp 便是要顯示的最上層jsp. 如果用jsp:include 頁面便會報錯，至於為什麼還沒研究，可能和加載順序有關。 （在給標簽變量取名字時候，如果變量和id名一樣時候，js也會報錯,要避免） 在父頁面添加觸發顯示遮罩層js： 在這裡創建一個div和body一樣大小，這樣就可以把整個頁面全部蓋住了。 style.zIndex 來控制覆蓋的先後順序（層級） style.filter ,style.opacity 控制顯示透明°。 代碼如下: //mask遮罩層 var newMask = document.createElement("div"); newMask.id = m; newMask.style.position = "absolute"; newMask.style.zIndex = "1"; _scrollWidth = Math.max(document.body.scrollWidth, document.documentElement.scrollWidth); _scrollHeight = Math.max(document.body.scrollHeight, document.documentElement.scrollHeight); newMask.style.width = _scrollWidth + "px"; newMask.style.height = _scrollHeight + "px"; newMask.style.top = "0px"; newMask.style.left = "0px"; newMask.style.background = "#666"; newMask.style.filter = "alpha(opacity=40)"; newMask.style.opacity = "0.40"; document.body.appendChild(newMask); js控制父頁面已經定義好的div顯示： 代碼如下: newDiv=document.getElementById("newDiv1"); // var newDiv = document.createElement("div"); // newDiv.id = _id; newDiv.style.position = "absolute"; newDiv.style.zIndex = "9999"; newDivWidth = 700; newDivHeight = 600; newDiv.style.width = newDivWidth + "px"; newDiv.style.height = newDivHeight + "px"; newDiv.style.top = (document.body.scrollTop + document.body.clientHeight / 2 - newDivHeight / 2) + "px"; newDiv.style.left = (document.body.scrollLeft + document.body.clientWidth / 2 - newDivWidth / 2) + "px"; newDiv.style.background = "#F7F7EF"; newDiv.style.border = "1px solid #860001"; newDiv.style.padding = "5px"; newDiv.style.display=''; js控制父頁面div滾動居中： attachEvent ,addEventListener 對scroll 添加處理事件 newDivCenter 代碼如下: function newDivCenter() { newDiv.style.top = (document.body.scrollTop + document.body.clientHeight / 2 - newDivHeight / 2) + "px"; newDiv.style.left = (document.body.scrollLeft + document.body.clientWidth / 2 - newDivWidth / 2) + "px"; } if (document.all) { window.attachEvent("onscroll", newDivCenter); } else { window.addEventListener('scroll', newDivCenter, false); } 動態給父頁面div添加關閉圖層和遮罩層（需要修改）： 代碼如下: var newA = document.createElement("a"); newA.href = "#"; newA.innerHTML = "關閉"; newA.onclick = function() { if (document.all) { window.detachEvent("onscroll", newDivCenter); } else { window.removeEventListener('scroll', newDivCenter, false); } document.body.removeChild(docEle("newDiv1")); document.body.removeChild(docEle(m)); document.getElementById("certImg").style.display=''; return false; } newDiv.appendChild(newA);