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,一是暴露的端口更少,方便管理:二是在网关中可 ...
随机推荐
- 巧用 git rebase 将某一部分 commit 复制到另一个分支
一.为什么需要将一个 commit 复制到其他分支上去呢? 在我们的实际开发的过程中,我们的项目中会存在多个分支. 在某些情况下,可能需要将某一个分支上的 commit 复制到另一个分支上去. 二 ...
- Tomact和XML配置文件
1 Http协议2 Tomcat服务器3 编写xml4 通过DTD约束编写指定格式的XML 5 通过Schema约束编写指定格式的XML6 使用D0M4J解析xml================== ...
- javaSE阶段中 关于Sring类方法的应用
String类中有很多常用的方法,今天就一些方法涉及到的一些常见题 做两个小Demo 其中一个要求如下: 获取指定字符串中,大写字母.小写字母.数字 的个数 题目分析 * 为了统计大写字母.小写字 ...
- 并发编程学习笔记之可见性&过期数据(二)
想要使用多线程编程,有一个很重要的前提,那就是必须保证操纵的是线程安全的类. 那么如何构建线程安全的类呢? 1. 使用同步来避免多个线程在同一时间访问同一数据. 2. 正确的共享和安全的发布对象,使多 ...
- C# 顺序表---增删改查--逆至--删除最小值
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
- Winform 数据库连接配置界面
一.添加引用 C:\Program Files\Microsoft Visual Studio 8\Common7\IDE\Microsoft.Data.ConnectionUI.Dial ...
- 动态合并GridView数据行DataRow的列
前段时间,Insus.NET一直在演示GridView控件Header头行或列:<动态变更GridView控件列名>和<动态合并或定制GridView控件Header头某些列> ...
- C,C++网络编程学习简明指南
C,C++网络编程学习简明指南 1. 扎实的C,C++基础知识 参考资料<C程序设计>,<C++ primer>. 2. TCP/IP协议 经典书是:W.Richard Ste ...
- 使用原生js来操作对象dom的class属性
之前一直都使用jquery来操作dom,今天想自己用原生写一些插件,却发现给dom增删class的时候,使用slice来截取className特别的麻烦,后来发现,原来原生JS本来就有提供api来对d ...
- s5pv210移植Minigui3.0.12
移植平台:ubuntu:14.04 开发板:s5pv210(A8) Minigui版本:3.0.12-------------------------------------------------- ...