`

js居中弹出层

JSP 
阅读更多
1:jsp页面片段
<script type="text/javascript" src="editdiv.js"></script>
<style>
#Loading{position:absolute;z-index:10;left:10px;top:10px;border:1px #666666 solid;background:#eeeeee;width:10px;height:10px}
* {
	padding:0;
	margin:0;
}
#upcontent {
	list-style-position:outside;
	list-style-image:none;
	list-style-type:none;
}
#upcontent li {
	font-size:12px;
	color:#333;
	line-height:150%;
  overflow:hidden;
}
#bodyL {
	float:left;
	width:84px;
	margin-right:2px;
}
#tittleup {
	font-size:14px;
	font-weight:bold;
	color:#000066;
	padding-left:25px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #d0daec;
	margin-bottom: 10px;
	padding-bottom: 10px;
}
a.od {
	float:right;
	font-size:14px;
	color: #CC0000;
	text-decoration: none;
}
a.od:hover {
	color:#FF0000;
}

.contentup {
	padding:20px;
 }
</style>
<!---------------------------------------------------------->
<img src="/img/edit.gif" width="16" height="16" border="0" style="cursor:hand;" onclick="OpenDiv_e(300,200,'<%=role_code %>','<%=role_name_r %>','<%=role_desc%>')"/>
 <div id="Loading" style="display:none" ondblclick="this.style.display='none'"></div>

2:引用的editdiv.js
function jv(){return document.getElementById?document.getElementById(arguments[0]):eval(arguments[0]);}
var OverH,OverW,ChangeH=50,ChangeW=50,code='',name='',desc='';
function OpenDiv_e(_Dw,_Dh,jcode,jname,jdesc) {
code=jcode;
name=jname;
desc=jdesc;
//alert(name);
jv("Loading").innerHTML="";
OverH=_Dh;OverW=_Dw;
jv("Loading").style.display='';
if(_Dw>_Dh){ChangeH=Math.ceil((_Dh-10)/((_Dw-10)/50))}
else if(_Dw<_Dh){ChangeW=Math.ceil((_Dw-10)/((_Dh-10)/50))}
jv("Loading").style.top=(document.body.scrollTop + document.body.clientHeight-10)/2+"px";
jv("Loading").style.left=(document.body.scrollLeft + document.body.clientWidth-10)/2+"px";
//alert(document.documentElement.clientHeight);
OpenNow_e();
}
var Nw=10,Nh=10;
function OpenNow_e() {
if (Nw>OverW-ChangeW)ChangeW=2;
if (Nh>OverH-ChangeH)ChangeH=2;
Nw=Nw+ChangeW;Nh=Nh+ChangeH;

if(OverW>Nw||OverH>Nh) {
if(OverW>Nw) {
jv("Loading").style.width=Nw+"px";
jv("Loading").style.left=(document.body.scrollLeft + document.body.clientWidth-Nw)/2+"px";
}
if(OverH>Nh) {
jv("Loading").style.height=Nh+"px";
jv("Loading").style.top=(document.body.scrollTop + document.body.clientHeight-Nh)/2+"px";
}
window.setTimeout("OpenNow_e()",0);
}else{
	//alert(name);
Nw=10;Nh=10;ChangeH=50;ChangeW=50;
jv("Loading").innerHTML="<div class='contentup'> <a href='#' class='od' onclick = \"javascript:jv('Loading').style.display='none'\"> 关 闭 </a>"
    +"<div id='tittleup'>修改角色</div>"
    +"<ul id='upcontent'>"
    +"<li>角色名称:<input type='text' name='role_name' id='role_name'  value='"+name+"' size='24' maxlength='30' /><span style='color:red;'>*</span></li>"
    +"<li>角色描述:<textarea name='role_desc' id='role_desc' cols='20' rows='3'>"+desc+"</textarea></li>"
    +"<li>&nbsp;</li>"
    +"<li style='text-align:center;'><span><input type='button' name='subarea' value='提 交' onClick=editInfo('"+code+"')></li>"
    +"<div style='clear:both;'></div>"
    +"</ul></div>";
   }
}
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics