javascript实现层div的显示和隐藏效果,用javascript设置style display属性为block（显示）和none（隐藏）,代码如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
<title>javascript实现层div的显示和隐藏效果</title>
<script type="text/JavaScript">
function toggle(targetid)
{
if (document.getElementById)
{
target=document.getElementById(targetid);
hideShowButtonObj=document.getElementById('butn');
if (target.style.display=="block")
{
target.style.display="none";
hideShowButtonObj.value="+Show"
hideShowButtonObj.style.fontWeight = "bold";
}
else
{
hideShowButtonObj.value="-Hide"
hideShowButtonObj.style.fontWeight = "bold";
target.style.display="block";
target.style.marginLeft = "50px";
}
}
window.event.cancelBubble = true;
return false;
}
</script>
<style type="text/css">
#helloworld
{
FONT-SIZE: x-small;
WIDTH: 100%;
COLOR: #555555
}
#butn
{
FONT-WEIGHT: bold
}
</style>
</head>
<body>
<input type="button" id="butn" value="+Show" οnclick="toggle('helloworld')">
</input>
<div style="display:none" width="100%" class="ValueText" id="helloworld">
Hello<br>
World<br>
</div>
</body>
</html>
3570
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
