最简单的点击展开关闭效果
无标题文档function show(obj){var obj=document.getElementById(obj); //获得id为b的容器//如果下面的内容显示的话就隐藏if(obj.style.display=="block"){obj.style.display="none";}elseobj.style.display="block";}
·
<!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>
<script type="text/javascript">
function show(obj){
var obj=document.getElementById(obj); //获得id为b的容器
//如果下面的内容显示的话就隐藏
if(obj.style.display=="block"){
obj.style.display="none";
}else
obj.style.display="block";
}
</script>
<style type="text/css" >
li{ list-style-type:none;}
#b{ display:none;}
#a input{ border:none; width:50px; background-color:#CCCCCC; }
</style>
</head>
<body>
<div id="a"><input type="button" οnclick="show('b')" value="导航">
<div id="b">
<ul>
<li>首页</li>
</div>
</body>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>无标题文档</title>
<script type="text/javascript">
function show(obj){
var obj=document.getElementById(obj); //获得id为b的容器
//如果下面的内容显示的话就隐藏
if(obj.style.display=="block"){
obj.style.display="none";
}else
obj.style.display="block";
}
</script>
<style type="text/css" >
li{ list-style-type:none;}
#b{ display:none;}
#a input{ border:none; width:50px; background-color:#CCCCCC; }
</style>
</head>
<body>
<div id="a"><input type="button" οnclick="show('b')" value="导航">
<div id="b">
<ul>
<li>首页</li>
<li>日志</li>
</ul>
</div></div>
</body>
</html>
更多推荐
已为社区贡献1条内容
所有评论(0)