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 类的列表,就可以为该菜单项添加一 ...
随机推荐
- SQL中判断字符串中包含字符的方法
通过2个函数CHARINDEX和PATINDEX以及通配符的灵活使用 函数:CHARINDEX和PATINDEX CHARINDEX:查某字符(串)是否包含在其他字符串中,返回字符串中指定表达式的起始 ...
- Android app作为系统应用实现功能笔记
1.禁用StatusBar相关功能需要添加权限 <uses-permission android:name="android.permission.STATUS_BAR"&g ...
- Webpack学习笔记(一)
转载http://zhaoda.net/webpack-handbook/module-system.html 转载http://www.cnblogs.com/vajoy/p/4650467.htm ...
- 一般增广路方法求网络最大流(Ford-Fulkerson算法)
/* Time:2015-6-18 接触网络流好几天了 写的第一个模版————Ford-Fulkerson算法 作用:求解网络最大流 注意:源点是0 汇点是1 如果题目输入的是1到n 请预处理减1 * ...
- UVa 11426
首先我们了解一下欧拉函数phi[x],phi[x]表示的是不超过x且和x互素的整数个数 phi[x]=n*(1-1/p1)*(1-1/p2)....(1-1/pn); 计算欧拉函数的代码为 int e ...
- C#_FindWindow
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- ZooKeeper搭建
ZooKeeper系列之一:ZooKeeper简介 ZooKeeper 是一个为分布式应用所设计的分布的.开源的协调服务.分布式的应用可以建立在同步.配置管理.分组和命名等服务的更高级别的实现的基础之 ...
- [JS思路]运动框架思路
匀速运动的思路一: 1.先清除动画,再加载动画 2.方向dir有正值和负值,可以通过 目标值 > 当前值 往右移动,即正数 目标值 < 当前值 往右移动,即负数 来进行判断:dir = ...
- CSS3秘笈复习:第十一章
1.text-align与vertical-align: text-align控制水平方向的定位,关键字是left.right.center和justify. vertical-align控制垂直方向 ...
- offsetWidth,offsetHeight到底该如何理解?
1.对象的可见宽度(对象指body.div等) 2.offsetWidth可以返回div的宽 3.offsetWidth=width+padding+border(不包括margin外边距) 4.返回 ...