jquery navi
/// <reference path="../global.js" />
/******************************************************
我的活动左则菜单
edit by yezhi
******************************************************/ YDW.SideNavi = (function () { var instance; function constructor() {
return {
accordion: function () {
var $sb = $('#sidebar');
var $sideNavBlock = $('#sidebar > .sideNav_block');
var $content = $('#content');
//隐藏子菜单
function hideSubmenu() {
$('#sidebar > #sideNav_block > div#ye_accordion > div > ul').hide();
}
function removeTitleClass() {
$('#sidebar > #sideNav_block > div#ye_accordion > div > h3 > a').removeClass('current');
}
function removeSubTitleClass() {
$('#sidebar > #sideNav_block > div#ye_accordion > div > ul > li').removeClass('current');
}
//添加标题右则小三角
function addDownArrow() {
$('#sidebar > #sideNav_block > div#ye_accordion > div > h3').each(function () {
var $ul = $(this).next('ul');
if ($ul.length > 0) {
$(this).append('<span class="dropdownArrow"></span>');
}
});
}
//设置菜单的最小高度
function setSitebarHeight() {
$sideNavBlock.css({ 'min-height': $(document).height() });
}
//为不够权限的菜单添加提示
function addTitleForUnauthorized() {
$('#sidebar > #sideNav_block > div#ye_accordion > div.unauthorized_block > ul > li').attr({ 'title': '此功能要升级为API版本方可使用' });
}
//给主体页添加背景,因左则无素切换不同的同容,只有左则内容为活动的菜单才须要添加该类,其它将移除该类
function addContainerBg() {
//$('.admin_master #content').css({ 'background': 'url(../content/images/admin/menu_bg.jpg) left top ' });
$('.admin_master #content').addClass('contentBg');
}
//初始化
function init() {
addContainerBg();
hideSubmenu();
addDownArrow();
addTitleForUnauthorized();
setSitebarHeight();
} init(); //父标题点击
$('#sidebar > #sideNav_block > div#ye_accordion > div > h3 > a').click(function () {
hideSubmenu();
removeTitleClass();
$(this).addClass('current').parent().next('ul').slideToggle();
return false;
});
//子标题点击
$('#sidebar > #sideNav_block > div#ye_accordion > div:not(".unauthorized_block") > ul > li').click(function () {
removeSubTitleClass();
$(this).addClass('current');
setSitebarHeight();
});
}
};
} return {
getInstance: function () {
if (!instance) {
instance = constructor();
}
return instance;
}
}
})(); (function ($) {
$(function () {
YDW.SideNavi.getInstance().accordion();
});
})(jQuery);
jquery navi的更多相关文章
- JQuery Sizzle引擎源代码分析
最近在拜读艾伦在慕课网上写的JQuery课程,感觉在国内对JQuery代码分析透彻的人没几个能比得过艾伦.有没有吹牛?是不是我说大话了? 什么是Sizzle引擎? 我们经常使用JQuery的选择器查询 ...
- jQuery Wheel 环形菜单插件5种效果演示
很酷的菜单-jQuery Wheel 环形菜单插件5种效果演示在线预览 下载地址 实例代码 <div class="container"> <!-- Top Na ...
- Web 在线文件管理器学习笔记与总结(6)jQuery UI 预览图片
① 查看文件内容,如果文件是图片类型,点击直接查看图片: ② 如果不是图片类型,显示文件中的内容: ③ 使用 jQuery UI 中的 Dialog 显示图片 a.引入: <script src ...
- 2013年优秀jQuery插件
今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件.图片放大插件.表单元素中自定义select插件,google 地图插件.文件拖放上传插件.tooltip ...
- [转]jQuery插件写法总结以及面向对象方式写法
本文转自:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented ...
- 关于 <script type='text/template' > 的妙用 / 使用jquery获取iframe加载完成事件
https://www.cnblogs.com/ddqyc/p/6200539.html <!DOCTYPE html> <html> <head> <met ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
- jQuery UI resizable使用注意事项、实时等比例拉伸及你不知道的技巧
这篇文章总结的是我在使用resizable插件的过程中,遇到的问题及变通应用的奇思妙想. 一.resizable使用注意事项 以下是我在jsfiddle上写的测试demo:http://jsfiddl ...
- Jquery的点击事件,三句代码完成全选事件
先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...
随机推荐
- 面试题:获取大量数据中某一条的index
提问: 群里分享了一个面试题:页面里有很多条数据,怎么知道这条数据的index,并且不使用循环? 分析: 如果在数组里,直接用indexOf,但对于对象会比较麻烦. 在页面上,不使用循环的话,可以用定 ...
- http://www.cnblogs.com/zhuli19901106/p/4356419.html
http://www.cnblogs.com/zhuli19901106/p/4356419.html
- Spring AOP 原理
AOP将应用系统分为两部分,核心业务逻辑(Core businessconcerns)及横向的通用逻辑,也就是所谓的方面Crosscutting enterprise concerns,例如,所有大中 ...
- 解压和生成 system.img&data.img ( yaffs2格式)
做为一名Android手机用户, 拿到system.img和data.img不是件难事 有这两个image可以做什么呢? ^_^可以做很多事,比如删除一些不想用的系统应用(/system/app目录下 ...
- WCF-NAT模式访问
由于项目需求,第一次用wcf做基于internet的访问.整理一下自己的探索,作为总结,也供自己以后回顾. 要求:(1)wcf服务需要部署在internet之中. (2)双工通信. 出现问题: 根据上 ...
- Light OJ 1314 Names for Babies
http://www.lightoj.com/volume_showproblem.php?problem=1314 题意:给定一个串和p,q,求长度在p到q之间的子串有几种 思路:后缀数组,对于每个 ...
- 通过代理访问nginx和直接访问nginx区别
80.82.78.38 [23/Sep/2016:05:36:18 +0800] "GET http://www.baidu.com/cache/global/img/gs.gif HTTP ...
- VSCode
下载: 打开终端控制器 wget http://download.microsoft.com/download/0/D/5/0D57186C-834B-463A-AECB-BC55A8E466AE/V ...
- CentOS系统、Jdk、Tomcat安装实战
CentOS系统.Jdk.Tomcat安装实战 第一次接触Liunx系统,都说J2EE系统在Li ...
- 【转载】cocos2d-x2.2.3和android的平台环境
这两天试图按照教程来学习写游戏移植到的横版过关Android在.在网上找了很多教程,但版本号变化.所使用的工具有细微的差别.所以,现在我们还没有准备好,阅读后,下面的文章.最后能够顺利您的手机上跑起来 ...