左侧菜单

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

        "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

    <title>Title</title>

    <style>

          .header{

            background-color: black;

            color: wheat;

        }

        .content{

            min-height: 50px;

        }

        .hide{

            display: none;

        }

    </style>

</head>

<body>

<div style="height:400px;width: 200px;border: 1px solid #dddddd">

        <div class="item">

            <div class="header">标题一</div>

            <div id="i1" class="content hide">内容</div>

        </div>

        <div class="item">

            <div class="header">标题二</div>

            <div class="content hide">内容</div>

        </div>

        <div class="item">

            <div class="header">标题三</div>

            <div class="content hide">内容</div>

        </div>

    </div>

<script src="jquery-1.12.4.js"></script>

<script>

    $(".header").click(function () {

        $(this).next().removeClass('hide').parent().siblings().find(".content").addClass("hide")

//next获取下一个标签

    })

</script>

</body>

</html>

左侧菜单

python : jquery实现左侧菜单的更多相关文章

  1. python : HTML+CSS (左侧菜单)

    左侧菜单 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3 ...

  2. jquery实现左侧菜单 效果

    html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...

  3. JQuery之左侧菜单

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. jquery左侧菜单

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. 亚马逊左侧菜单延迟z三角 jquery插件jquery.menu-aim.js源码解读

    关于亚马逊的左侧菜单延迟,之前一直不知道它的实现原理.梦神提到了z三角,我也不知道这是什么东西.13号那天很有空,等领导们签字完我就可以走了.下午的时候,找到了一篇博客:http://jayuh.co ...

  6. python :页面布局 ，后台管理页面之左侧菜单跟着滚动条动

    左侧菜单跟着滚动条动 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:// ...

  7. jquery实现全选，取消，反选的功能&实现左侧菜单

    1.全选,取消,反选的例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  8. 使用layui-tree美化左侧菜单，点击生成tab选项

    layui-tree美化左侧菜单 html <div class="layui-side layui-bg-black"> <div class="la ...

  9. python jquery

    jquery 一.寻找元素(选择器和筛选器) a.选择器 1.基本选择器 1 $("*")  $("#id")   $(".class")  ...

随机推荐

  1. JQuery 遍历子元素+ each函数的跳出+提取字符串中的数字

    最近脑袋迷糊的如同一团浆糊,一直出错. HTML代码如下图,现在想实现的功能是根据Ajax请求,获取到具体的button,以更新其样式.由于Button较多,每个Button都设置id,没有意义,想通 ...

  2. document.body.clientHeight 和 document.documentElement.clientHeight的区别

    document.body.clientWidth ==> BODY对象宽度document.body.clientHeight ==> BODY对象高度document.document ...

  3. 安卓APP测试之使用Burp Suite实现HTTPS抓包方法

    APP的测试重点小部分在APP本身,大部分还是在网络通信上(单机版除外).所以在安卓APP测试过程中,网络抓包非常重要,一般来说,app开发会采用HTTP协议.Websocket.socket协议,一 ...

  4. Oracle常用命令（持续更新）

    --1.解锁用户 alter user 用户名 account unlock; --2.开启最小补充日志记录(执行的DML操作会被记录下来)  alter database add supplemen ...

  5. thinkphp自定义权限管理之名称判断

    权限管理,就是给不同的用户分配不同的权限.当用户登录或者操作时候进行判断,来阻止用户进行权限以外的操作.本次讲的是当用户登录一刻,只显示权限开启的内容. 一.建立数据库. 1.权限表funcla.来存 ...

  6. 关于格式转换 “%a.bs”

    这个形式的格式转换符用于输出, 如果a <= b,  那么输出的字符串串长大于等于a, 小于b; 否则, 输出的串长按照a指定的输出. (不够,用空格补齐)

  7. papi酱视频因违规遭下线整改，你知道原因吗？

    今日4月18日,在微信上的一篇<papi酱遭广电总局封杀 罗振宇1200万恐打水漂>的文章迅速转了起来,说的就是现在网红第一人“papi酱”的视频被广电总局责令下架的消息.箭头直指papi ...

  8. Java 集合快速失败异常

    快速失败 在JDK中,查看集合有很多关于快速失败的描述: 注意,此实现不是同步的.如果多个线程同时访问一个哈希映射,而其中至少一个线程从结构上修改了该映射,则它必须 保持外部同步.(结构上的修改是指添 ...

  9. Where is the Global.asax.cs file

    I am using VS 2008. I have created a new Asp.net web site project from File->New->Website-> ...

  10. C#中的特性基本理解

    定制特性可以应用的目标元素可以为:程序集(assembly).模块(module).类型(type).属性(property).事件(event).字段(field).方法(method).参数(pa ...