文档章节

菜单折叠--siblings() slideDown

陈爱茹cx1992
 陈爱茹cx1992
发布于 2016/07/26 17:36
字数 256
阅读 10
收藏 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>

本文转载自:http://blog.csdn.net/ruru7989/article/details/10430535

共有 人打赏支持
陈爱茹cx1992
粉丝 0
博文 59
码字总数 0
作品 0
济南
程序员
私信 提问
jquery实现类似以前凡客诚品右侧图文切换结合效果

终于公司的新闻发布会弄好了,据说反响不错,70多家媒体,排场蛮大的。 现在又得重新回到开发中,新版的商城需要改版,已经实现各大版块的,样式结构,浏览器兼容已经搞定,虽然有纠结的IE6...

天外飘雪
2012/09/29
0
0
Jquery 手风琴菜单

布雷泽
2011/06/16
0
0
05-老马jQuery教程-动画

前言 jQuery的动画系统做的非常出色,而且把最常用的显示、隐藏、淡入淡出、滑动显示和折叠凳效果都做了很好的封装。跟jQuery的选择器和事件配合起来,可以实现很多很绚的效果,而且简单易用...

aicoder
2017/12/05
0
0
菜鸟问个简单的JQUERY的问题

使用JQUERY做导航菜单 鼠标滑过 显示下拉菜单 用什么方法啊 我用slideDown 显得不自然啊 不流畅

心有猛虎在细嗅蔷薇
2012/03/29
182
2
二维码弹出叠加效果

主要是利用事件,进行元素和边界判定,从而自动弹出或隐藏二维码。 HTML结构如下: CSS定义如下: 架子已搭好,可以绑定鼠标事件了:

一点灵犀
2016/07/12
176
0

没有更多内容

加载失败,请刷新页面

加载更多

我的Linux系统九阴真经

在今天,互联网的迅猛发展,科技技术也日新月异,各种编程技术也如雨后春笋一样,冒出尖来了。各种创业公司也百花齐放百家争鸣,特别是针对服务行业,新型互联网服务行业,共享经济等概念的公...

linux-tao
27分钟前
3
0
MySQL: Starting MySQL….. ERROR! The server quit without updating PID file

前段时间打包了一个数据库镜像,但是启动容器之后发现报错 ··· ··· MySQL: Starting MySQL….. ERROR! The server quit without updating PID file 查了网络上的解决方案比较全,遂转帖...

blackfoxya
29分钟前
1
0
C4C销售订单行项目价格维护方法

需求很简单,能够创建销售订单,在行项目里添加产品,带出价格来,同时把总价显示在销售订单抬头区域。 如下图所示: 下面是具体配置。 Business Configuration里,点击Sales Order的配置: ...

JerryWang_SAP
今天
12
0
deepin中配置robot framework环境

本文永久更新地址:https://my.oschina.net/bysu/blog/2989005 【若要到岸,请摇船:开源中国 不最醉不龟归】 1.在终端中输入pip,回车,如果提示没有该命令,则先安转pip sudo apt-get inst...

不最醉不龟归
今天
11
0
OSChina 周日乱弹 —— 钱不还,我就当你人不在了

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @莱布妮子 :分享Bigleaf的单曲《小鹿》 《小鹿》- Bigleaf 手机党少年们想听歌,请使劲儿戳(这里) 周日在家做什么? 做手工呀, @poorfis...

小小编辑
今天
254
5

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部