一个简单的展开收缩(自己写的)
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#btn1{ border:1px solid #999; background:#fff; height:24px; line-height:21px; *line-height:23px; _line-height:23px; margin:0px;}
#div1{ border:1px solid #999; background:#fff; display:none; margin-top:-1px; padding:0px; visibility:visible; width:60px;}
#div1 p{ font-size:14px; height:20px; line-height:20px; _line-height:22px; *line-height:22px; text-indent:0.4em; margin:0; padding:0;}
#div1 p a{color:#666; display:block; text-decoration:none;}
#div1 p a:hover{ color:#fff!important; background:#609ADB;}
</style>
<script type="text/javascript">
/*function showHide()
{
var oDiv=document.getElementById('div1')
var oBtn=document.getElementById('btn1')
if(oBtn.value=='展开')
{
if(oDiv.style.display=='block')
{
oDiv.style.display='none'
}
else
{
oBtn.value='收起'
oDiv.style.display='block'
}
}
else
{
oBtn.value='展开'
oDiv.style.display='none'
}
}*/
function show()
{
var oDiv=document.getElementById('div1')
var oBtn=document.getElementById('btn1')
if(oBtn.value=='展开')
{
if(oDiv.style.display=='block')
{
oDiv.style.display='none'
}
else
{
oBtn.value='收起'
oDiv.style.display='block'
}
}
}
function hide()
{
var oDiv=document.getElementById('div1')
var oBtn=document.getElementById('btn1')
if(oBtn.value=='收起')
{
if(oDiv.style.display=='block')
{
oBtn.value='展开'
oDiv.style.display='none'
}
else
{
oDiv.style.display='block'
}
}
}
</script>
</head>
<body>
<input id="btn1" type="button" value="展开" onmouseover="show()" onmouseout="hide()"/>
<div id="div1" onmouseover="show()" onmouseout="hide()">
<p><a href="javascript:;" title="对话">对话</a></p>
<p><a href="javascript:;" title="收藏">收藏</a></p>
<p><a href="javascript:;" title="分享">分享</a></p>
<p><a href="javascript:;" title="详情">详情</a></p>
</div>
</body>
</html>
