Jquery折叠效果
Jquery折叠效果
Jquery代码 ：
<script src="jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">
$(function(){
var t = [];
var dt = $("dl.collapse dt");
var dd = $("dl.collapse dd");
dt.each(function(i){
t[i] = false;
$(dt[i]).click((function(i,dd){
return function(){
if(t[i]){
$("dd").show(500);
t[i] = false;
}else{
$("dd").hide(500);
t[i] = true;
}
}
})(i,dd[i]));
})
})
</script>
HTML代码：
<body>
<dl class="collapse">
<dt>标题栏</dt>
<dd>内容框<br /><img src="p_w_picpaths/1.jpg" /></dd>
</dl>
</body>
说明：each() 方法规定为每个匹配元素规定运行的函数。
附图：