简单的点击显示、隐藏效果-技术开发专区

简单的点击显示、隐藏效果

作者：ITPUB论坛编辑： nancy 2008-05-07 00:00

【IT168技术文档】

开始只有头部显示，点击头部再显示出尾部。

事例效果：

<script  type="text/javascript">
function show(){
if(document.getElementById("table_foot").style.display=="block"){
document.getElementById("table_foot").style.display="none";
}else{
document.getElementById("table_foot").style.display="block";
}
}
</script>
<table border="1" width="100%">
<tr id="table_head" onclick="show()" style="cursor:pointer;">
<td align="center">头部</td>
</tr>
<tr id="table_foot" style="display:none;">
<td height="300" align="center" valign="middle" >尾部</td>
</tr>
</table>

display="block";
display="none";
调过来就是开始都显示，然后点击头部，尾部隐藏！

关注我们