<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "" title="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>js实现div层</title>
<style type="text/css">
.black_div
{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: gray;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=80);
}
.white_div
{
display: none;
position: absolute;
top: 20%;
left: 10%;
width: 80%;
height: 150px;
padding: 0px;
border: 1px solid #aaabbbccc;
background-color: white;
z-index: 1002;
overflow: auto;
}
.divTitle
{
font-size: 14px;
color: White;
font-weight: bold;
background-color: #009900;
}
.divContent
{
margin-top: 30px;
}
</style>
<script type="text/javascript" language="javascript">
function opendiv(){
document.getElementById('light').style.display='block';
document.getElementById('fade').style.display='block';
}
function colsediv(){
document.getElementById('light').style.display='none';
document.getElementById('fade').style.display='none';
}
function copyValue()
{
var strValue=document.getElementById("setUrl").innerText;
if(isIE())
{
clipboardData.setData("Text",strValue);
alert("您已成功复制了此地址");
}
else
{
alert("仅支持IE,Sorry!");
}
}
function isIE(number)
{
if(typeof(number)!=number)
{
return!!document.all;
}
}
</script>
</head>
<body>
<p>
<a href="#" οnclick="opendiv()">点击这里</a></p>
<div id="light" class="white_div">
<div class="divTitle">
<table width="100%">
<tr>
<td align="left" style="padding-left: 20px;">
标题:
</td>
<td align="right">
<span style="float: right; padding-right: 30px; text-align: right;cursor: pointer" οnclick="colsediv()">关闭</span>
<span style="float: right; padding-right: 30px; text-align: right; cursor: pointer" οnclick="copyValue()">复制</span>
</td>
</tr>
</table>
</div>
<div class="divContent" id="setUrl">
1:测试 2:继续测试 3:测试完毕
</div>
</div>
<div id="fade" class="black_div">
</div>
</body>
</html>