/// <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的更多相关文章

  1. JQuery Sizzle引擎源代码分析

    最近在拜读艾伦在慕课网上写的JQuery课程,感觉在国内对JQuery代码分析透彻的人没几个能比得过艾伦.有没有吹牛?是不是我说大话了? 什么是Sizzle引擎? 我们经常使用JQuery的选择器查询 ...

  2. jQuery Wheel 环形菜单插件5种效果演示

    很酷的菜单-jQuery Wheel 环形菜单插件5种效果演示在线预览 下载地址 实例代码 <div class="container"> <!-- Top Na ...

  3. Web 在线文件管理器学习笔记与总结(6)jQuery UI 预览图片

    ① 查看文件内容,如果文件是图片类型,点击直接查看图片: ② 如果不是图片类型,显示文件中的内容: ③ 使用 jQuery UI 中的 Dialog 显示图片 a.引入: <script src ...

  4. 2013年优秀jQuery插件

    今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件.图片放大插件.表单元素中自定义select插件,google 地图插件.文件拖放上传插件.tooltip ...

  5. [转]jQuery插件写法总结以及面向对象方式写法

    本文转自:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented ...

  6. 关于 <script type='text/template' > 的妙用 / 使用jquery获取iframe加载完成事件

    https://www.cnblogs.com/ddqyc/p/6200539.html <!DOCTYPE html> <html> <head> <met ...

  7. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件

    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...

  8. jQuery UI resizable使用注意事项、实时等比例拉伸及你不知道的技巧

    这篇文章总结的是我在使用resizable插件的过程中,遇到的问题及变通应用的奇思妙想. 一.resizable使用注意事项 以下是我在jsfiddle上写的测试demo:http://jsfiddl ...

  9. Jquery的点击事件,三句代码完成全选事件

    先来看一下Js和Jquery的点击事件 举两个简单的例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&q ...

随机推荐

  1. Webpack: 为Web开发而生的模块管理器[转]

    Webpack: 为Web开发而生的模块管理器 原文地址:http://hanjianwei.com/2014/09/10/webpack-package-manager-for-web/ 10 Se ...

  2. CryEngine3教程合辑

    转载自http://tieba.baidu.com/p/3663800102 作者:Tytaa     中文名称: CryEngine游戏关卡设计训练视频教程第一季 外文名称: 3DMotive In ...

  3. android 无法生成R文件的原因剖析

    android 无法生成R文件 是件痛苦的事情,即使有时候你xml文件没有错误,他都无法生成.针对此问题,我总结以下几个方面的原因. 一.xml本身有错误 R.java这个文件是会自动生成的,但是如果 ...

  4. bzoj1624 [Usaco2008 Open] Clear And Present Danger 寻宝之路

    Description     农夫约翰正驾驶一条小艇在牛勒比海上航行.     海上有N(1≤N≤100)个岛屿,用1到N编号.约翰从1号小岛出发,最后到达N号小岛.一 张藏宝图上说,如果他的路程上 ...

  5. java反编译工具(XJad)

    java反编译工具(XJad) 2.2 绿色版 http://www.cr173.com/soft/35032.html Demo.class     --->    Demo.java

  6. [转载]Linux的时间与时钟中断处理

    本文主要介绍在Linux下的时间实现以及系统如何进行时钟中断处理. 一. Linux的硬件时间 PC机中的时间有三种硬件时钟实现,这三种都是基于晶振产生的方波信号输入.这三种时钟为: 实时时钟RTC ...

  7. Android studio无法更新 提示网络连接失败

    Android studio 更新时,提示网络问题 “Connection failed. Please check your network connection and try again” 在默 ...

  8. Webservice-Java-Xfire

    最近公司最近需要将以前提供出去的接口统一用一个标准来实现,考虑到webservice这个是标 准,因此我花时间大概学习了一下webservice,也对JAVA的几个webservice框架进行了一些小 ...

  9. DOS命令大全--具体解释

    在Linux和Windows下都能够用nslookup命令来查询域名的解析结果 DOS命令大全一)MD--建立子文件夹 1.功能:创建新的子文件夹 2.类型:内部命令 3.格式:MD[盘符:][路径名 ...

  10. 安装MySQL和Navicat,并与MyEclipse连接

    1.下载安装MySQL 1)到http://dev.mysql.com/downloads/下载MySQL社区版Server,和用于JDBC的Connector.一路默认安装就可以,须要注意的是记住M ...