<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn" lang="zh-cn">
<head>
<title>弹出层</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="zh-cn" />
<meta name="robots" content="all" />
<meta name="author" content="penglewen" />
<meta name="copyright" content="www.oneways.cn" />
<meta http-equiv="imagetoolbar" content="no" />
<style type="text/css">
body {
text-align: center;
color: #000;
margin: 0 auto;
padding: 0;
font: 12px Verdana,Tahoma,sans-serif,Arial,宋体;
line-height: 1.6em;
background: #69a11c;
letter-spacing: 1.4px;
}
* { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,p { display: block; text-align: left; }
table { border: 0; margin: 0; padding: 0; border-collapse : collapse; }
img { border: 0; }
a { text-decoration: none; color: #000; }
a:hover { color: #c00; text-decoration: none; }
#wrap {
text-align: center;
margin: 0 auto ;
padding: 50px 0 ;
width: 300px;
background: #ccc;
}
#showBox {
text-align: center;
position: absolute;
left: 0;
top: 0;
z-index: 99;
width: 100%;
height: 100%;
}
#msleft {
position: absolute;
left: 0;
top: 0;
z-index: 1002;
width: 100%;
height: 100%;
}
#alphaBox {
position: absolute;
left: 0;
top: 0;
z-index: 1000;
width: 100%;
height: 100%;
background: #000;
filter:alpha(opacity=60); /* IE */
opacity: 0.6; /* 支持CSS3的浏览器(FF 1.5也支持)*/
-moz-opacity: 0.6; /* Moz + FF */
}
#content {
color: #416f02;
margin: 0 auto;
margin-top: 150px;
width: 400px;
height: 200px;
padding-left: 50px;
border: 10px solid #ff7e02;
background-color: #fff;
}
#content h2 { font-size: 22px; color: #c00; padding: 10px 0; text-align: center; }
#content a { color: #416f02; }
#content a:hover { color: #c00; }
.intro{ color: #c27006; }
.close { text-align: right; height: 20px; margin: 20px 20px 0 0; }
</style>
<script type="text/javascript">
<!--
function boxAlpha() {
var showBox=document.getElementById("showBox");
var bgalpaha = document.getElementById("alphaBox");
var content = document.getElementById("content");
if(showBox.style.display == "none") {
showBox.style.display = "block";
showBox.style.height = document.documentElement.scrollHeight;
bgalpaha.style.height= document.documentElement.scrollHeight+"px";
if (navigator.appName == "Microsoft Internet Explorer")
bgalpaha.style.width = document.documentElement.scrollWidth + "px";
else
bgalpaha.style.width = document.documentElement.scrollWidth + "px";
// alert(document.documentElement.scrollHeight);
}
else
showBox.style.display = "none";
}
//-->
</script>
</head>
<body>
<div id="wrap">
<input type="text" name="code" id="code" /> <input type="button" οnclick="boxAlpha();" value="弹出取值" />
</div>
<div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /> 取值<br /><br /><br /><br />
</div>
<div id="showBox" style="display:none;">
<div id="msleft">
<div id="content">
<h2>弹出取值</h2>
<a οnclick="document.getElementById('code').value='值1';boxAlpha();" style="cursor:pointer">值1</a><Br/>
<a οnclick="document.getElementById('code').value='值2';boxAlpha();" style="cursor:pointer">值2</a><Br/>
<a οnclick="document.getElementById('code').value='值3';boxAlpha();" style="cursor:pointer">值3</a><Br/>
<a οnclick="document.getElementById('code').value='值4';boxAlpha();" style="cursor:pointer">值4</a><Br/>
<a οnclick="document.getElementById('code').value='值5';boxAlpha();" style="cursor:pointer">值5</a><Br/>
<a οnclick="document.getElementById('code').value='值6';boxAlpha();" style="cursor:pointer">值6</a><Br/>
<p class="close"><input type="button" name="button" οnclick="boxAlpha();" value="关闭" />
</div>
</div>
<div id="alphaBox"></div>
</div>
</body>
</html>