显示隐藏层
代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://hi.baidu.com/yxmlantian/">
<html xmlns=http://hi.baidu.com/yxmlantian>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>弹出层</title>
<style>
.more{
display:none;
background-color:#fdfef9;
height:98px;
color:#000;
border:#589021 2px solid;
font-size:12px;
padding:5px 5px;
position:absolute;
line-height:22px;
}
.divbox{/*提供一个相对节点，让弹出层相对它绝对定位；*/
height:0px;
line-height:0;
font-size:0;
position:relative;
}
</style>
<script type="text/javascript">
function player(id){
var id=document.getElementById(id)
id.style.display="block";
}
function clocer(id){
var id=document.getElementById(id)
id.style.display="none";
}
</script>
</head>
<body>
<span OnMouseOver="player('any1');" onMouseOut="clocer('any1');" style="cursor:hand;">100%</span>
<div class="divbox">
<div id="any1" class="more" OnMouseOver="player('any1');" onMouseOut="clocer('any1');">
<table border="0" cellpadding="1" cellspacing="1" bgcolor="#D7D7D7" style="font-size:12px; color:#404040;">
<tr>
<td width="81" height="28" bgcolor="#F8F8F8"> </td>
<td width="73" align="center" bgcolor="#F8F8F8">非常不满</td>
<td width="73" align="center" bgcolor="#F8F8F8">不满意</td>
<td width="73" align="center" bgcolor="#F8F8F8">一般</td>
<td width="73" align="center" bgcolor="#F8F8F8">满意</td>
<td width="73" align="center" bgcolor="#F8F8F8">非常满意</td>
<td width="73" align="center" bgcolor="#F8F8F8"><b>总计</b></td>
</tr>
<tr>
<td height="30" align="center" bgcolor="#FFFFFF"><img src="http://www.guangjiezu.com/images/pj_biaosh.gif" /> 评价</td>
<td align="center" bgcolor="#FFFFFF">2</td>
<td align="center" bgcolor="#FFFFFF">4</td>
<td align="center" bgcolor="#FFFFFF">10</td>
<td align="center" bgcolor="#FFFFFF">3</td>
<td align="center" bgcolor="#FFFFFF">0</td>
<td align="center" bgcolor="#FFFFFF">19</td>
</tr>
<tr>
<td height="30" align="center" bgcolor="#FFFFFF"><b>总计</b></td>
<td align="center" bgcolor="#FFFFFF">2</td>
<td align="center" bgcolor="#FFFFFF">4</td>
<td align="center" bgcolor="#FFFFFF">10</td>
<td align="center" bgcolor="#FFFFFF">3</td>
<td align="center" bgcolor="#FFFFFF">0</td>
<td align="center" bgcolor="#FFFFFF">19</td>
</tr>
</table>
</div>
</div>
</body>
</html>
<html xmlns=http://hi.baidu.com/yxmlantian>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>弹出层</title>
<style>
.more{
display:none;
background-color:#fdfef9;
height:98px;
color:#000;
border:#589021 2px solid;
font-size:12px;
padding:5px 5px;
position:absolute;
line-height:22px;
}
.divbox{/*提供一个相对节点，让弹出层相对它绝对定位；*/
height:0px;
line-height:0;
font-size:0;
position:relative;
}
</style>
<script type="text/javascript">
function player(id){
var id=document.getElementById(id)
id.style.display="block";
}
function clocer(id){
var id=document.getElementById(id)
id.style.display="none";
}
</script>
</head>
<body>
<span OnMouseOver="player('any1');" onMouseOut="clocer('any1');" style="cursor:hand;">100%</span>
<div class="divbox">
<div id="any1" class="more" OnMouseOver="player('any1');" onMouseOut="clocer('any1');">
<table border="0" cellpadding="1" cellspacing="1" bgcolor="#D7D7D7" style="font-size:12px; color:#404040;">
<tr>
<td width="81" height="28" bgcolor="#F8F8F8"> </td>
<td width="73" align="center" bgcolor="#F8F8F8">非常不满</td>
<td width="73" align="center" bgcolor="#F8F8F8">不满意</td>
<td width="73" align="center" bgcolor="#F8F8F8">一般</td>
<td width="73" align="center" bgcolor="#F8F8F8">满意</td>
<td width="73" align="center" bgcolor="#F8F8F8">非常满意</td>
<td width="73" align="center" bgcolor="#F8F8F8"><b>总计</b></td>
</tr>
<tr>
<td height="30" align="center" bgcolor="#FFFFFF"><img src="http://www.guangjiezu.com/images/pj_biaosh.gif" /> 评价</td>
<td align="center" bgcolor="#FFFFFF">2</td>
<td align="center" bgcolor="#FFFFFF">4</td>
<td align="center" bgcolor="#FFFFFF">10</td>
<td align="center" bgcolor="#FFFFFF">3</td>
<td align="center" bgcolor="#FFFFFF">0</td>
<td align="center" bgcolor="#FFFFFF">19</td>
</tr>
<tr>
<td height="30" align="center" bgcolor="#FFFFFF"><b>总计</b></td>
<td align="center" bgcolor="#FFFFFF">2</td>
<td align="center" bgcolor="#FFFFFF">4</td>
<td align="center" bgcolor="#FFFFFF">10</td>
<td align="center" bgcolor="#FFFFFF">3</td>
<td align="center" bgcolor="#FFFFFF">0</td>
<td align="center" bgcolor="#FFFFFF">19</td>
</tr>
</table>
</div>
</div>
</body>
</html>
浙公网安备 33010602011771号