jquery多级下拉菜单
var menu = new Click('#menu',{target:'p',parent:'li',contr:'ul',way:0});
/*
参数说明:
target : 点击事件发生在该元素内
way : 0 只显示一个,1允许显示多个;
parent : 点击的祖先元素标识,用以查找控制元素
contr : 控制的元素 */
function Click(me,parm){
var tar = parm.target, parent = parm.parent, contr = parm.contr, way = parm.way;
$(me).click(function(e){
var t = $(e.target);
if(t.is(tar) || t.closest(tar).size()>0){
// 下一级
var m = t.closest(parent).children(contr); // 判断下一级显示
if(m.is(':hidden')) {
m.slideDown();
if(!way){
t.closest(parent).siblings(parent).find(contr).slideUp();
};
}else{
m.slideUp();
};
};
});
};
demo:
点击文字展开
2015-2016学年下学期初二期末考试(三)
科目:语文95
- 其他
科目:数学110
- 其他
2015-2016学年下学期初二期末考试(三)2
科目:语文99
- 其他
科目:英语100
- 其他
点击箭头展开
2015-2016学年下学期初二期末考试(三)
↓
科目:语文95
↓
- 其他
科目:数学110
↓
- 其他
2015-2016学年下学期初二期末考试(三)2
↓
科目:语文99
↓
- 其他
科目:英语100
↓
- 其他
jquery多级下拉菜单的更多相关文章
- jquery实现多级下拉菜单
支持多种浏览器,体验效果:http://keleyi.com/keleyi/phtml/jqmenu/4.htm 多级菜单,理论上支持无限多的层级,文件结构非常简单的,以下是完整代码: <!DO ...
- 基于jQuery带图标的多级下拉菜单
之前为大家分享了很多导航菜单.今天我们要来分享一款很不错的jQuery左侧带小图标的多级下拉菜单,菜单是垂直的,每一个菜单项带有一个小图标,看起来非常专业.并且菜单支持无限极下拉,所以对各位Web开发 ...
- jQuery水平下拉菜单实现
<!DOCTYPE html> <html> <head> <title>jQuery水平下拉菜单实现</title> ...
- 一款多浏览器兼容的javascript多级下拉菜单
这个多级下拉菜单的脚本大小不到2K,带有动画效果,可以方便地支持多个实例,并且能良好兼容WordPress系统wp_list_cats和wp_list_pages生成的多级列表.要初始化一个菜单,只需 ...
- jquery 实现下拉菜单
Jquery 是一个轻量的框架,个人认为非常好用,今天就写一个非常简单的例子,实现下拉菜单功能: 首先肯定要在页面引用jquery.js 版本不限 : 接下来把=================== ...
- 第72天:jQuery实现下拉菜单
jQuery实现下拉菜单 一.居中 1.块元素居中:给块元素本身设置:margin:0 auto;,块元素必须设置宽度 2.行内块元素居中:给元素父级设置text-algin:center; < ...
- jquery带下拉菜单和焦点图
jQuery,下拉菜单,二级菜单,索引按钮,焦点图代码,jquery带下拉菜单和焦点图是一款顶部通栏带二级下拉菜单和banner导航菜单代码. JQuery特效代码来源:http://www.huiy ...
- 小程序多级下拉菜单demo
小程序多级下拉菜单demo - CSDN博客 https://blog.csdn.net/github_39371177/article/details/80251211
- bootstrap多级下拉菜单
只需为下拉菜单的任意 <li> 元素添加 .dropdown-submenu 的类,并在该 <li> 元素下添加 .dropdown-menu 类的列表,就可以为该菜单项添加一 ...
随机推荐
- C/C++中整数与浮点数在内存中的表示方式
在C/C++中数字类型主要有整数与浮点数两种类型,在32位机器中整型占4字节,浮点数分为float,double两种类型,其中float占4字节,而double占8字节.下面来说明它们在内存中的具体表 ...
- Busy Beavers(暴力模拟)
由于排版问题,题目无法显示,可以到 http://7xjob4.com1.z0.glb.clouddn.com/e4872a15819b6bf9d1e5250bacc2a30b 查看 题目大意是有只 ...
- SQL语句的优化
1.创建索引 表中数据经常需要用的哪些字段数据进行过滤,则添加该字段的索引,索引相当如一本书的目录,能加快查询数据的速度:同时在新建索引的时候,将需要查询的列,在包含性 列中新增上去,能减少查询语句的 ...
- Linux性能监测:CPU篇(转)
http://os.51cto.com/art/201012/239880.htm CPU 的占用主要取决于什么样的资源正在 CPU 上面运行,比如拷贝一个文件通常占用较少 CPU,因为大部分工作是由 ...
- TESTNG重试、截屏、监听
http://qa.blog.163.com/blog/static/19014700220138585422735/
- RF+Jenkins构建持续集成
引入RF是为了能够快速的开展自动化验收测试,Jenkins而一种持续集成工具,用于监控持续重复的工作,持续的软件版本发布/测试项目,而通过RF+Jenkins可以有利的对RF构建的接口项目进行持续集成 ...
- 第一百一十五节,JavaScript,DOM操作表格
JavaScript,DOM操作表格 学习要点: 1.操作表格 DOM在操作生成HTML上,还是比较简明的.不过,由于浏览器总是存在兼容和陷阱,导致最终的操作就不是那么简单方便了.本章主要了解一下DO ...
- js常见的判断移动端或者pc端或者安卓和苹果浏览器的方法总结
1.js常见的判断移动端或者pc端或者安卓和苹果浏览器的方法总结 : http://www.haorooms.com/post/js_pc_iosandmobile 2.Js判断客户端是否为PC还是手 ...
- struts2防止重复提交的标签
struts2 token 使用说明 --------------------------------------------------------------------------------- ...
- Node.js:全局对象
概要:本篇博客主要介绍了node.js中的全局对象. 在JavaScript中,通常window是全局对象,而node.js中的全局对象是global,所有全局变量(除了global本身之外)都是gl ...