jq二级目录
CSS:
.qsc_nav_main .level1 {
text-align: center;
height: auto;
}
.qsc_nav_main .level1 a {
display: inline-block;
font-size: 16px;
height: 45px;
color: #fff;
}
.qsc_nav_main .level2 {
display: none;
}
.qsc_nav_main .level2 li {
text-align: center;
height: 45px;
color: #999;
} HTML:
<div class="qsc_company_nav">
<ul class="qsc_nav_main">
<li class="level1">
<a href="javascript:;" class="current">首页</a>
</li>
<li class="level1">
<a href="javascript:;">合作企业管理</a>
<ul class="level2">
<li>供应商</li>
<li>采购商</li>
</ul>
</li>
<li class="level1">
<a href="javascript:;">账款管理</a>
<ul class="level2">
<li>应收账款</li>
<li>应付账款</li>
<li>账款确认</li>
</ul>
</li>
<li class="level1">
<a href="javascript:;">借款管理</a>
<ul class="level2">
<li>借款</li>
<li>还款</li>
</ul>
</li>
<li class="level1">
<a href="javascript:;">我的中心</a>
<ul class="level2">
<li>我的中心</li>
<li>三方协议查询</li>
<li>借款协议查询</li>
</ul>
</li>
<li class="level1">
<a href="javascript:;">账户管理</a>
</li>
</ul>
</div>
JS:
/*二级菜单 显示一个二级菜单时其他的隐藏,再次点击已显示的二级菜单时,该二级菜单隐藏*/
$(".level1 > a").click(function(){
var iclass = $(this).attr("class");
if (iclass=="current"){
$(this).next().hide().prev("a").removeClass("current");
}else {
$(this).addClass("current").next().show()
.parent().siblings()
.children("a").removeClass("current").next().hide();
return false;}
});
第二种方法:可同时显示多个二级菜单,点击显示/隐藏 $(function(){
$(".level1 > a").click(function(){
$(this).next().toggle(800,function(){
//TODO
});
});
}); // $(function(){
// $(".level1 > a").click(function(){
// $(this).next().slideToggle(800,function(){ //滑动
// //TODO
// });
// });
// });
jq二级目录的更多相关文章
- thinkphp 3.2 linux二级目录安装
详解:http://document.thinkphp.cn/manual_3_2.html#url_rewrite 注意:linux系统对大小写敏感 服务器系统:linux (阿里云服务器) thi ...
- linux下关于Apache设置二级域名绑定二级目录的方法
背景:对于一些论坛网站,某些目录需要制定二级域名去访问,这时候就要在apache中用二级域名绑定二级目录. 方法: 1.首先你要找到apache安装路径,在apahce安装路径下的conf文件夹中找到 ...
- WordPress程序伪静态规则(Nginx/Apache)及二级目录规则
在众多CMS程序中,我们使用WORDPRESS还是比较多的,不仅仅是安全度较好,二来在于插件和主题很多,即便对于不会建站技术的用户也很简单的就可以搭建属于自己的网站项目.对于网站我们肯定是需要让有用户 ...
- 301重定向.htaccess规则(含二级目录跳转二级域名)
301重定向是一种非常重要的"自动转向"技术.网址重定向最为可行的一种办法.当用户或搜索引擎向网站服务器发出浏览请求时,服务器返回的HTTP数据流中头信息(header)中的状态码 ...
- bootstrap导航条在手机上默认展开二级目录,必须用setTimeout才能实现
bootstrap导航条在手机上默认展开二级目录,必须用setTimeout才能实现 $(document).ready(function() { $('.dropdown').hover(funct ...
- 有二级目录的IIS配置
当项目配置文件中配置了二级目录时,如下: <!--二级目录地址--> <add key="SecondCatalog" value="/hotel&qu ...
- zencart侧边导航点击一级目录展开二级目录
[小 大] 2013-09-17 00:20 来源: 未知 作者:wtozz_admin 我要投稿 zencart侧边导航点击一级目录展开二级目录 zen cart Categories默认的是只显示 ...
- Nginx配置二级目录/路径 映射不同的反向代理和规避IP+端口访问
当配置Nginx来映射不同的服务器 可以通过二级路径来反向代理 来解决一个外网端口实现多个服务访问. 配置如下: server { listen ; server_name demo.domai ...
- .Net Core小技巧 - Swagger适配虚拟目录及二级目录
前言 随着前后端分离模式与微服务架构的出现,Web API变得越来越重要及普遍.而后出现的网关技术,使开发者更倾向于使用二级/多级目录来暴露Web API,一是暴露的端口更少,方便管理:二是在网关中可 ...
随机推荐
- SSH框架(四) struts2+spring3.0的登陆示例
(一)关键理念及需要注意的地方: 使用struts2+spring3.0的框架搭建web程序,就是使用spring来进行依赖注入(依赖注入请参考baidu上面的解释:http://baike.baid ...
- 使用Notepad++与Dev_c++编译
1. 安装Dev.打开DEV安装目录下的 D:\app\DevCpp\Dev-Cpp\MinGW64\bin(因人而异). 2.添加环境变量,测试. 将上述路径D:\app\DevCpp\Dev-Cp ...
- MySQL数据库简介
数据库就是数据的集合. 关系数据库是一种特殊的数据库,它将数据组织成表,并表示为表之间的关系. 数据库系统往往是大型项目的核心数据内容,如银行的用户账户信息.腾讯的QQ用户账户信息.股市的各种交易信息 ...
- SLAM(Linux版)
之前的那个是Windows版,现在终于发现Windows运行slam是不行的,多么痛的领悟. 本书系统地介绍了视觉SLAM所需的基本知识与核心算法,既包括数学理论基础,如三维空间的刚体运动.非线性优化 ...
- WebGoat系列实验Denial of Service & Insecure Communication
WebGoat系列实验Denial of Service & Insecure Communication ZipBomb 服务器仅接收ZIP文件,将上传的文件解压,进行操作之后删除.已知服务 ...
- javax.servlet.ServletConfig接口(五)
主要作用是保存web.xml文件里面的配置信息 一个servlet对应一个ServletConfig,100个servlet对应100个ServletConfig. 代码如下(单个获取和获取所有) ...
- C#代码标识符命名规范
总体原则:命名一定要体现其在程序中的作用: Camel命名法:第一个单词的首字母小写,其余每个单词的首字母大写:多用给变量或者字段命名:给字段命名必须以下划线开始: Pascal命名法:每个单词的首字 ...
- Data Base 常用数据库参数的前缀表示符合
可能参数化SQL语句不同,例如在Access中参数化SQL语句是在参数直接以“?”作为参数名,在SQL Server中是参数有“@”前缀,在MySQL中是参数有“?”前缀,在Oracle中参数以“:” ...
- FPM工具 实战定制nginx包
FPM主要特点: 把一种包打包成另一种包的格式 支持的源类型包 DIR 将目录打包成所需要的类型,可以用于源码编译的安装包. RPM 对rpm进行转换 gem 对rubygem包进行转换. ...
- Go语言在线培训哪里好?Git操作和代码管理
在实际的项目开发过程中,多人进行项目开发,需要涉及到代码管理和协同管理.这就需要使用到代码协同管理工具.在过去,大家都熟悉使用的是SVN软件,而现在Git代码仓库管理软件的使用更为广泛.在本系列实战项 ...