菜单折叠--siblings() slideDown
菜单折叠--siblings() slideDown
陈爱茹cx1992 发表于1年前
菜单折叠--siblings() slideDown
  • 发表于 1年前
  • 阅读 7
  • 收藏 0
  • 点赞 0
  • 评论 0

【腾讯云】如何购买服务器最划算?>>>   

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>菜单折叠</title>
</head>
<body>
<div id="zd">全部折叠</div><div id="zk">全部展开</div>
  <div class="w"><h2>Hello</h2>
  <span>HHHHHHHH</span>
  <div>HHHHHHHH</div>
  <div>HHHHHHHH</div>
  </div>
  <div class="w"><h2>Hello Again</h2>
  <div>DDDD</div>
  <div>DDDD</div>
  <div>DDDD</div>
  </div>
  <div><h2>And Again</h2></div>
  <div>siblings() 是选择同辈元素,$("h2").siblings()是和h2同级的元素</div>
  <div>slideDown() 通过使用滑动效果,显示隐藏的被选元素。(down 放下,也就是展开)</div>
  <div>slideUp() 通过使用滑动效果,隐藏被选元素,如果元素已显示出来的话。(up 折叠起来,也就是隐藏起来的意思)</div>

<script type="text/javascript" src="jquery-1.5.1.js"></script>
<script type="text/javascript">
$(function(){
  $('h2').bind('click',function(){
$this = $(this);
if($this.siblings().is(':hidden')){
 $this.siblings().slideDown('nomal');
}else if($this.siblings().is(':visible')){
 $this.siblings().slideUp('normal');
}
});

$("#zd").click(function(){
$("h2").siblings().slideUp('normal');
});
$("#zk").click(function(){
$("h2").siblings().slideDown('normal');
});
});
</script>
</body>
</html>
共有 人打赏支持
粉丝 0
博文 59
码字总数 0
×
陈爱茹cx1992
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: