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,一是暴露的端口更少,方便管理:二是在网关中可 ...
随机推荐
- java Iterator类
查看java源码. /* * Copyright (c) 1997, 2013, Oracle and/or its affiliates. All rights reserved. * ORACLE ...
- kaggle House_Price_XGBoost
kaggle House_Price_final 代码 import numpy as np import pandas as pd from sklearn.ensemble import Rand ...
- LeetCode第110题:平衡二叉树
问题描述 给定一个二叉树,判断它是否是高度平衡的二叉树. 本题中,一棵高度平衡二叉树定义为: 一个二叉树每个节点 的左右两个子树的高度差的绝对值不超过1. 示例 1: 给定二叉树 [3,9,20,nu ...
- springMvc参数传递的方法
package cn.edu.hj.controller; import java.util.Map; import javax.servlet.http.HttpServletRequest; im ...
- easyui rowspan
第一种写法 columns: [ [ { field: 'depName', title: '部门', rowspan: 2, width: '100px', align: 'center' }, { ...
- C# 链表 --增 -删-反转-删除最小值
1. Node.cs namespace 链表 { public class Node<T> { public T Data; //这个就是地址 public Node<T> ...
- C++ 打印缓存区数据 十六进制格式
1.调试C++程序时,有时可能需要以16进制打印输出缓存区数据,以定位跟踪问题,现提供其实现的代码: void printHex(char* buff, int buff_len) { + ); if ...
- Django之表单form
在登录系统以及需要上传填入的信息时候,用的最多就是表单系统,例如像下面的这种格式 <form action="/form1/" method="post" ...
- 算法训练 Cowboys(DP)
问题描述 一个间不容发的时刻:n个牛仔站立于一个环中,并且每个牛仔都用左轮手枪指着他旁边的人!每个牛仔指着他顺时针或者逆时针方向上的相邻的人.正如很多西部片那样,在这一刻,绳命是入刺的不可惜……对峙的 ...
- [SinGuLaRiTy] 高一下半期测试
[SinGuLaRiTy-1017] Copyright (c) SinGuLaRiTy 2017. All Rights Reserved. 对于所有的题目: Time Limit: 1s | Me ...