首页> 菜单导航 >jquery下拉菜单显示隐藏效果代码

jquery下拉菜单显示隐藏效果代码

牛人织梦发表于2015-06-02 15:59
jquery下拉菜单显示隐藏效果代码

网页效果:菜单导航

所用脚本:jQuery

下载金币:

查看演示
无链接信息!

访问密码:

客服中心

QQ:718163418 QQ 工作时间:9:00-22:00
详细描述
 <ul class="sidebar-list">
 
<li>
                    <a href="#" class="topicList"><i class="icon-font">&#xe033;</i>查询统计</a>
                    <ul class="sub-menu" style="display:none">
                        <li><a href="{:U('Admin/MsgManage/reportQuery','','')}" target="iframe"><i class="icon-font">&#xe012;</i>状态查询</a></li>
                        <li><a href="{:U('Admin/MultipleQuery/index','','')}" target="iframe"><i class="icon-font">&#xe052;</i>综合查询</a></li>
                        <li><a href="{:U('Admin/Report/index','','')}" target="iframe"><i class="icon-font">&#xe033;</i>统计报表</a></li>
<li><a href="{:U('Admin/MsgManage/removeAlready','','')}" target="iframe"><i class="icon-font">&#xe033;</i>已解除</a></li>
                    </ul>
                </li>
 
<li>
                    <a href="#" class="topicList"><i class="icon-font">&#xe017;</i>权限管理</a>
                    <ul class="sub-menu" style="display:none">
                        <li><a href="{:U('Admin/Rbac/index')}" target="iframe"><i class="icon-font">&#xe033;</i>用户列表</a></li>
                        <li><a href="{:U('Admin/Rbac/role')}" target="iframe"><i class="icon-font">&#xe037;</i>角色列表</a></li>
                        <li><a href="{:U('Admin/Rbac/node')}" target="iframe"><i class="icon-font">&#xe046;</i>节点列表</a></li>
                        <li><a href="{:U('Admin/Rbac/addUser')}" target="iframe"><i class="icon-font">&#xe045;</i>添加用户</a></li>
   <li><a href="{:U('Admin/Rbac/addRole')}" target="iframe"><i class="icon-font">&#xe046;</i>添加角色</a></li>
                        <li><a href="{:U('Admin/Rbac/addNode')}" target="iframe"><i class="icon-font">&#xe045;</i>添加节点</a></li>
                    </ul>
                </li>
 
                <li>
                    <a href="#" class="topicList"><i class="icon-font">&#xe018;</i>系统管理</a>
                    <ul class="sub-menu" style="display:none">
                        <li><a href="{:U('Admin/Unit/index')}" target="iframe"><i class="icon-font">&#xe033;</i>单位管理</a></li>
                        <li><a href="{:U('Admin/Link/index')}" target="iframe"><i class="icon-font">&#xe037;</i>联动管理</a></li>
                        <li><a href="{:U('Admin/Unit/add')}" target="iframe"><i class="icon-font">&#xe046;</i>添加单位</a></li>
                        <li><a href="{:U('Admin/User/index')}" target="iframe"><i class="icon-font">&#xe045;</i>修改密码</a></li>
                    </ul>
                </li>
            </ul>

<script type="text/javascript" src="__PUBLIC__/Js/jquery-1.7.2.min.js"></script>


<script type="text/javascript"> 
$(function(){ 
$(".topicList").click(function(){ 
var UL = $(this).next("ul"); 
if(UL.css("display")=="none"){ 
UL.css("display","block"); 
else{ 
UL.css("display","none"); 
}); 
}); 
</script> 
 

------分隔线----------------------------
顶一下
(0)
0%
踩一下
(0)
0%
用户评论

(Time:9:00-18:00)

技术客服 718163418

业务客服 441241479

【牛人】织梦交流群2