左侧菜单

<!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. java输入一个字符串，打印出该字符串中字符的所有排列,随机打乱排序

    import java.util.ArrayList;import java.util.Collections;import java.util.List; public class Test7{   ...

  2. sqlmap 1.0.21 tamper 总结

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  3. 温故而知新，jquery选择器$=

    $("select[name$=Sort]") 可以选择到如下元素: <select class="sort-selec" name="eton ...

  4. php session_start() 非常慢 问题原因查找

    最近在做东西的时候发现一个问题 有一个接口挂了 ,然后进行测试访问地址的时候,浏览器就一直处于等待响应的状态 怎么访问都不行,只有重启web服务器才行. 如果不重启web服务器进行代码调试,总发现在s ...

  5. Wordpress本地伪静态设置

    遇到的问题: 在主题的目录页,用wordpress默认链接方式是的,但是改了固定链接结构为:/%post_id%.html后,就访问不了了,开始以为是我主题的问题,然后切换为官方主题也是访问不了,而神 ...

  6. NPOI操作excel之写入数据到excel表

    在上一篇<NPOI操作excel之读取excel数据>我们把excel数据写入了datatable中,本篇就讲如何把datatable数据写入excel中. using System; u ...

  7. Lock较synchronized多出的特性

    1.尝试非阻塞形式获取锁 tryLock() :当前线程尝试获取锁,如果锁被占用返回false;如果成功则占有锁 //类似用法if(lock.tryLock()) { try { System.out ...

  8. IIS6(Win2003) 使用.net 4.0 后，默认文档失效解决方案。

    IIS6(Win2003) 使用.net framework 4.0 后,默认文档失效解决方案. 用.net framework 4.0 开发的WEB项目,但放到iis6 中无法使用默认文档,状况如下 ...

  9. Beginning Android 4 中 Demo Basic/Switch 的问题.

    作者的版本: layout (main.xml): <?xml version="1.0" encoding="utf-8"?> <Linea ...

  10. leetcode 374

    这个题目很简单,但是要注意细节和对题目的理解,一开始我把guess函数的作用理解错了,第一版代码长这样: int guessNumber(int n) { ; int high = n; while( ...