jquery 菜单展开与收缩参考脚本
/*
* metismenu - v1.1.3
* Easy menu jQuery plugin for Twitter Bootstrap 3
* https://github.com/onokumus/metisMenu
*
* Made by Osman Nuri Okumus
* Under MIT License
*/
;(function($, window, document, undefined) { var pluginName = "metisMenu",
defaults = {
toggle: true,
doubleTapToGo: false
}; function Plugin(element, options) {
this.element = $(element);
this.settings = $.extend({}, defaults, options);
this._defaults = defaults;
this._name = pluginName;
this.init();
} Plugin.prototype = {
init: function() { var $this = this.element,
$toggle = this.settings.toggle,
obj = this; if (this.isIE() <= 9) {
$this.find("li.active").has("ul").children("ul").collapse("show");
$this.find("li").not(".active").has("ul").children("ul").collapse("hide");
} else {
$this.find("li.active").has("ul").children("ul").addClass("collapse in");
$this.find("li").not(".active").has("ul").children("ul").addClass("collapse");
} //add the "doubleTapToGo" class to active items if needed
if (obj.settings.doubleTapToGo) {
$this.find("li.active").has("ul").children("a").addClass("doubleTapToGo");
} $this.find("li").has("ul").children("a").on("click" + "." + pluginName, function(e) {
e.preventDefault(); //Do we need to enable the double tap
if (obj.settings.doubleTapToGo) { //if we hit a second time on the link and the href is valid, navigate to that url
if (obj.doubleTapToGo($(this)) && $(this).attr("href") !== "#" && $(this).attr("href") !== "") {
e.stopPropagation();
document.location = $(this).attr("href");
return;
}
} $(this).parent("li").toggleClass("active").children("ul").collapse("toggle"); if ($toggle) {
$(this).parent("li").siblings().removeClass("active").children("ul.in").collapse("hide");
} });
}, isIE: function() { //https://gist.github.com/padolsey/527683
var undef,
v = 3,
div = document.createElement("div"),
all = div.getElementsByTagName("i"); while (
div.innerHTML = "<!--[if gt IE " + (++v) + "]><i></i><![endif]-->",
all[0]
) {
return v > 4 ? v : undef;
}
}, //Enable the link on the second click.
doubleTapToGo: function(elem) {
var $this = this.element; //if the class "doubleTapToGo" exists, remove it and return
if (elem.hasClass("doubleTapToGo")) {
elem.removeClass("doubleTapToGo");
return true;
} //does not exists, add a new class and return false
if (elem.parent().children("ul").length) {
//first remove all other class
$this.find(".doubleTapToGo").removeClass("doubleTapToGo");
//add the class on the current element
elem.addClass("doubleTapToGo");
return false;
}
}, remove: function() {
this.element.off("." + pluginName);
this.element.removeData(pluginName);
} }; $.fn[pluginName] = function(options) {
this.each(function () {
var el = $(this);
if (el.data(pluginName)) {
el.data(pluginName).remove();
}
el.data(pluginName, new Plugin(this, options));
});
return this;
}; })(jQuery, window, document);
jquery 菜单展开与收缩参考脚本的更多相关文章
- jQuery 当前展开其他收缩 三级下拉菜单(转载)
jQuery可展开收缩三级下拉菜单 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- jQuery 菜单栏 展开与收缩例子
废话少说,上代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...
- jQuery弹性展开收缩菜单插件gooey.js
分享一款基于jQuery弹性展开收缩菜单插件gooey.js.这是一款基于gooey.js插件实现的弹性菜单特效代码.效果图如下: 在线预览 源码下载 实现的代码. html代码: <hea ...
- jquery垂直展开折叠手风琴二级菜单
摘要:jquery实现垂直展开二级菜单 最近新开发一个简单项目,用到左侧两级的菜单.找找了手头的文件,竟然没有现成的代码,算了,去网上找找整理下吧. 注:jquery-1.8.3.min.js需要下载 ...
- jQuery鼠标悬停3d菜单展开动画
效果体验:http://hovertree.com/texiao/jquery/93/ 竖直的主菜单贴着页面左侧,当光标移入菜单项时,以3D动画的方式弹出对应的二级菜单.采用jQuery和CSS3实现 ...
- 分享21个基于jquery菜单导航的效果
jquery导航菜单插件制作jquery动画菜单熔岩灯菜单效果更新时间:02月15日 14:53:03 虾米精选-菜单导航-导航菜单 0浏览 / ★★★☆☆星级 / 未知软件大小/ jquery导航菜 ...
- 10款最新CSS3/jQuery菜单导航插件
这是我们在2014年收集的10款最新的CSS3 / jQuery菜单导航插件,不论从外观样式,还是功能扩展性,这些jQuery菜单一定可以满足大家的设计需求.这次我们收集的jQuery菜单,有水平 菜 ...
- 【iOS系列】-UITableViewCell的展开与收缩的实现思路
UITableViewCell的展开与收缩的实现思路 现在项目中很多地方都会用到,所以我这里介绍一种可以复用的思路,这与文章后面的Swift的实现思路不同,具体大家可自行对比. Demo项目地址 开始 ...
- Ext.grid rowexpander的展开与收缩
这里写Ext.grid.Panel的展开与收缩. 1. 确保在grid存在rowexpander对象: plugins: [{ ptype: 'rowexpander', rowBodyTpl: [' ...
随机推荐
- set(集合)数据类型【七】
一.概述:(类似于Java的Set,不允许有重复元素) 在Redis中,我们可以将Set类型看作为没有排序的字符集合,和List类型一样,我们也可以在该类型的数据值上执行添加.删除或判断某一元素是否存 ...
- POJ 3320_Jessica's Reading Problem
题意: 每页书都对应一个知识点,问最少看连续的多少页,才能把所有知识点都看完? 分析: <挑战程序设计竞赛>介绍的尺取法,反复推进区间的开头和结尾,来求取满足条件的最小区间,先确定好一个满 ...
- UVA 140_Bandwidth
题意: 定义一个结点的带宽是其距离所有相连结点的最远距离,一个图的带宽是图中所有结点带宽的最小值.给出一个图中各个结点的相邻情况,要求写出一个结点的排列,使得其所构成的图带宽最小. 分析: 枚举全排列 ...
- JavaScript高级篇之Function对象
JavaScript高级篇之Function对象 一: Function对象引入: Function对象是js的方法对象,可以用Function实例化出任何js方法对象. 例如: <%@ pag ...
- spring mvc随便接收list<objeect>参数
在后台设定一个类,PersonList类: public class PersonList {private List<User> user; public List<User> ...
- 电脑无线WIFI怎么共享给手机
点屏幕右下角的那个小电脑(网络)标志,里面有打开网络和共享中. 选左上角管理无线网络——选择添加. 选择创建临时网络——点击下一步——输入网络名称. 安全类型选择WEP——安全密钥为10位数字——然后 ...
- 【转】使用Python中HTTPParser模块进行简单的html解析
http://www.cnblogs.com/coser/archive/2012/01/09/2317076.html
- 华为OJ2011-最长公共子串
一.题目描述 描述: 计算两个字符串的最大公共子串(Longest Common Substring)的长度,字符区分大小写. 输入: 输入两个字符串 输出: 输出一个整数 样例输入: asdfas ...
- Mac OS X 10.10, Eclipse+ADT真机调试代码时,Device Chooser中不显示真机的解决方式
Mac OS X 10.10的环境下.Eclipse+ADT,进行真机调试时,会出现一个问题. Device Chooser对话框里不显示真机设备,仅仅有又一次插拔数据线才干够. 经过測试.有两个暂时 ...
- Hibernate学习笔记(六) — Hibernate的二级缓存
我们知道hibernate的一级缓存是将数据缓存到了session中从而降低与数据库的交互.那么二级缓存呢? 一.应用场合 比方.在12306购票时.须要选择出发地与目的地,假设每点一次都与数据库交互 ...