文档章节

菜单折叠--siblings() slideDown

陈爱茹cx1992
 陈爱茹cx1992
发布于 2016/07/26 17:36
字数 256
阅读 86
收藏 0

精选30+云产品,助力企业轻松上云!>>>

<%@ 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>
陈爱茹cx1992
粉丝 0
博文 59
码字总数 0
作品 0
济南
程序员
私信 提问
加载中
请先登录后再评论。
jq 方法函数(淡入淡出,查找元素,过滤)遍历

淡入淡出:fadeIn fadeOut fadeToggle fadeTo   淡入:fadeIn(speed[,callback]) 速度和回调函数 回调函数可以写匿名函数,或者方法名不加括号。       speed 为‘slow’或 1000 毫...

osc_5i4e20is
2018/06/22
2
0
js控制json生成菜单——自制菜单(一)

此文档解决以下问题: 1.JSON文件的书写方式 2.jQuery.getJSON()的运用 3.jQuery.each()的运用 4.jQuery的DOM 操作方法之一:.append()的运用 5.jQuery的遍历方法之一:.children()的运用 6....

osc_67z4ojk9
2018/08/17
1
0
jquery中slidedown()、slideup()和stop()使用导致高度改变的问题

不加shop,则多个动画一起执行,乱.加了.就不完全显示.所 以加上true即可 由$(this).find("h2").addClass("on").siblings(".text").stop().slideDown(); 修改为 $(this).find("h2").addClass(......

越野小生
2015/07/12
49
0
有序无序Ul->Li Ol->Li菜单,默认点击当前弹出下拉,再次点击收起下拉菜单(变形2 ---修饰)

从上面可以看出,两个问题,第一:下拉出现的太快太突然,第二:再点击下一个下拉菜单的时候,上一个不会闭合,针对这两个问题,接下来会一 一解决。 解决下拉太快: js中有个jquery效果,有...

osc_271igh42
2018/06/21
2
0
Web前端JQuery入门实战案例

前端入门到实战 为什么要学习?因为生活。 案例: 使用案例: 快速的,轻量级的,功能丰富的 js 库。动画(),,,更简单,容易使用的。 文档 开发环境,测试环境,生产环境 对象和对象 对象其...

达叔小生
2019/02/24
3
0

没有更多内容

加载失败,请刷新页面

加载更多

绕过移动端系统限制的 dlopen 库 byOpen

byOpen是一个绕过移动端系统限制的增强版dlfunctions库。 支持特性 Android 支持App中加载和使用Android系统库接口(即使maps中还没有被加载也支持)。 Android 7以上dlopen, System.load都是...

shzwork
昨天
15
0
Golang学习系列第二天:变量、常量、数据类型和流程语句

继golang第一天后,今天学习下golang的变量、常量、数据类型和控制流语句。 做过其他编程语言(比如JavaScript,java,python)项目的话,其实很好理解变量、常量、数据类型和控制流。 变量也...

董广明
昨天
20
0
redis系列之——一致性hash算法

一致性hash算法你了解吗?什么时候使用?解决什么问题?redis集群模式使用了一致性hash算法了吗? 数据分片(sharding) 分布式数据存储时,经常要考虑数据分片,避免将大量的数据放在单表或...

诸葛小猿
昨天
15
0
IMDB是否提供API? [关闭] - Does IMDB provide an API? [closed]

问题: I recently found a movie organizer application which fetches its data from the IMDB database . 最近,我发现了一个电影管理器应用程序,该应用程序从IMDB数据库中获取其数据。 ...

fyin1314
昨天
14
0
Elasticsearch系列之Query DSL

1 前言 我们先通过阅读官方文档,了解一下什么是 Query DSL 。 1.1 Query DSL Elasticsearch provides a full Query DSL (Domain Specific Language) based on JSON to define queries. DSL是......

冯文议
昨天
20
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部