jsp 创建 覆盖层DIV 怎么创建 【源代码】

来源:互联网 发布:《深入Linux内核架构》 编辑:程序博客网 时间:2024/04/29 19:51
自己写的一个脚本: 

把下面这几个脚本和jsp代码放在你的jsp页面调用createDIV 方法就okl了 


引用

<script type="text/javascript"> 
function createDIV(content) { 
document.getElementById("DetailLayer").innerHTML = content; 
var DetailLayer = document.getElementById("DetailLayer"); 
var webBgLayer = document.getElementById("webBgLayer"); 
// ShopConfirmLayer.innerHTML=str; 
DetailLayer.style.display = "";//显示内容层,显示覆盖层 

webBgLayer.style.display = ""; 
webBgLayer.style.width = document.documentElement.scrollWidth + 900 + "px"; //为覆盖层设置宽度 
webBgLayer.style.height = document.documentElement.scrollHeight + 1600 
+ "px"; //为覆盖层设置高度 

DetailLayer.style.left = ((webBgLayer.style.width - 726) / 2) + "px"; 
DetailLayer.style.top = Math 
.abs(parseInt((document.documentElement.clientHeight - ShopConfirmLayer.offsetHeight) / 2)) 
+ document.documentElement.scrollTop + "px"; //为内容层设置位置 

</script> 



<!--信息内容层--> 

<div id="DetailLayer" 
style="position: absolute; top: 0px; left: 100px; z-index: 900; width: 726px; display: none; background-color: white"> 
<img src="jslib/mytable/images/loader.gif"><!--加载时候显示图片--> 
<input name="button1" value="关闭" type="button" onclick="CloseDetail()" /> 
</div> 

<!--覆盖层--> 
<div id="webBgLayer" 
style="position: absolute; top: 0px; left: 0px; z-index: 899; background-color: gray; height: 100%; width: 100%; display: none; -moz-opacity: 0.9; filter: alpha(opacity =50);"> 
</div> 


function CloseDetail() { //关闭 层 
var DetailLayer = document.getElementById("DetailLayer"); 
var webBgLayer = document.getElementById("webBgLayer"); 
DetailLayer.style.display = "none"; 
webBgLayer.style.display = "none"; 


原创粉丝点击