div能不能让一个层置于另一层之上
就像ps中那样的,两个层可以上下互换位置,让哪一个作背影都可以.最好能实现两个层不在同一个水平线上....
就像ps中那样的,两个层可以上下互换位置,让哪一个作背影都可以.最好能实现两个层不在同一个水平线上.
展开
展开全部
看看以下的实现方法:
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta http-equiv="Content-Type" content="text/html" charset="gb2312">
</head>
<body leftmargin=0 topmargin=0>
<div id="bgLayer" style="position:absolute;background:#CCCCCC;top:0px;width:100%;height:100%;filter:alpha(style=0,opacity=50);display:none;z-index:9998;"> </div>
<div id="topLayer" style="position:absolute;background:#999999;top:0px;width:420px;height:150px;display:none;z-index:9999;">
<table width=100% height=100% bgcolor="#FFFFFF" style="position:relative;top:-5px;left:-5px;border:solid #999999 1px;">
<tr>
<td><center><input type="button" value="确 定" onclick="javaScript:hideEdit();"></center></td>
</tr>
</table>
</div>
<br><br><br>
<p>
<center>
<input type="button" value="显 示" onclick="javaScript:showEdit();">
</center>
<script language="JavaScript">
<!--
function showEdit(id){
document.all["bgLayer"].style.display="";
document.all["bgLayer"].style.height=document.body.scrollHeight;
document.all["topLayer"].style.display="";
timer=setInterval(move,"50");
}
function hideEdit(){
clearInterval(timer);
document.all["bgLayer"].style.display="none";
document.all["topLayer"].style.display="none";
}
function move(){
document.all["topLayer"].style.top=document.body.scrollTop+document.body.clientHeight/2-110;
document.all["topLayer"].style.left=document.body.scrollLeft+document.body.clientWidth/2-200;
}
//-->
</script>
</body>
</html>
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<meta http-equiv="Content-Type" content="text/html" charset="gb2312">
</head>
<body leftmargin=0 topmargin=0>
<div id="bgLayer" style="position:absolute;background:#CCCCCC;top:0px;width:100%;height:100%;filter:alpha(style=0,opacity=50);display:none;z-index:9998;"> </div>
<div id="topLayer" style="position:absolute;background:#999999;top:0px;width:420px;height:150px;display:none;z-index:9999;">
<table width=100% height=100% bgcolor="#FFFFFF" style="position:relative;top:-5px;left:-5px;border:solid #999999 1px;">
<tr>
<td><center><input type="button" value="确 定" onclick="javaScript:hideEdit();"></center></td>
</tr>
</table>
</div>
<br><br><br>
<p>
<center>
<input type="button" value="显 示" onclick="javaScript:showEdit();">
</center>
<script language="JavaScript">
<!--
function showEdit(id){
document.all["bgLayer"].style.display="";
document.all["bgLayer"].style.height=document.body.scrollHeight;
document.all["topLayer"].style.display="";
timer=setInterval(move,"50");
}
function hideEdit(){
clearInterval(timer);
document.all["bgLayer"].style.display="none";
document.all["topLayer"].style.display="none";
}
function move(){
document.all["topLayer"].style.top=document.body.scrollTop+document.body.clientHeight/2-110;
document.all["topLayer"].style.left=document.body.scrollLeft+document.body.clientWidth/2-200;
}
//-->
</script>
</body>
</html>
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
