如何做展开收起

bohanhe 2012-01-11 10:51:52

如图

我想用label显示信息，如果要做成图示效果，该怎么做呢

...全文

241 11 打赏收藏转发到动态举报

写回复

用AI写文章

11 条回复

切换为时间正序

请发表友善的回复…

发表回复

義東 2012-01-12

打赏
举报

用jquery很方便，可以参考一下一楼的代码

naonaoye 2012-01-12

打赏
举报

就像1楼的，用jq的slideToggle函数比较方便

zorro911 2012-01-12

打赏
举报

function show()
{
　　if(document.getElementById("").style.display == "none")
　　{
　　　　document.getElementById("").style.display = "";
　　}
　　else
　　{
　　　　document.getElementById("").style.display = "none";
　　}
}

laowang134 2012-01-11

打赏
举报

楼主要的这种！~想实现比较舒服的效果不好做！~。。

SomethingJack 2012-01-11

打赏
举报

[Quote=引用 3 楼 jack15850798154 的回复:]

具体的参考一下： <script type=text/javascript>
function show_hiddendiv() {
document.getElementById("hidden_div").style.display = 'block';
document.getElementById("_strHr……
[/Quote]
这个其实就是隐藏和显示问题- -至于展开和收缩那是加个标记就可以了

jack15850798154 2012-01-11

打赏
举报

具体的参考一下： <script type=text/javascript>
function show_hiddendiv() {
document.getElementById("hidden_div").style.display = 'block';
document.getElementById("_strHref").href = 'javascript:hidden_showdiv();';
document.getElementById("_strSpan").innerHTML = "收起-";
}
function hidden_showdiv() {
document.getElementById("hidden_div").style.display = 'none';
document.getElementById("_strHref").href = 'javascript:show_hiddendiv();';
document.getElementById("_strSpan").innerHTML = "展开+";
}
</script>
星期一星期二星期三<span style="display none" id="hidden_div">星期一星期二星期三</span>...(<a
id="_strHref" href="javascript:show_hiddendiv();"><span
id="_strSpan">展开+</span></span></a>) 不一定和你的一样仅供参考。

jack15850798154 2012-01-11

打赏
举报

用样式+js 控制！

EnForGrass 2012-01-11

打赏
举报



<title>jquery与动态下拉效果</title>

<style type="text/css">

.con{width:250px; height:100px; padding-top:50px; text-align:center; font-size:14px; color:white; background:#aaaaaa; border:1px solid #666666; display:none;}

.click{font-size:12px; margin-top:10px; float:left;}

</style>

<script src="http://static.l99.com/js/jquery/jquery-1.2.6.pack.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function(){

$(".click").click(function(){

   $("#content").slideToggle("fast");

   return false;

}); 

});

</script>



<body>

<div id="content" class="con">这里显示主要内容……</div>

<a href="#" class="click">点击我!</a>

</body>