• 点击标题显示隐藏效果--jQuery


    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script src="jquery-1.4.2.js"></script>
    <script type="text/javascript">
    $(function(){

    // $("#panel h5.head").bind("mouseover",function(){
    // $(this).next("div.content").show();
    // });
    // $("#panel h5.head").bind("mouseout",function(){
    // $(this).next("div.content").hide();
    // });

    // $("#panel h5.head").mouseover(function(){
    // $(this).next("div.content").show();
    // });
    // $("#panel h5.head").mouseout(function(){
    // $(this).next("div.content").hide();
    // });

    // $("#panel h5.head").hover(function(){
    // $(this).next("div.content").show();
    // },function(){
    // $(this).next("div.content").hide();
    // });

    $("#panel h5.head").toggle(function(){
    $(this).addClass("highlight");
    $(this).next("div.content").toggle();
    },function(){
    $(this).removeClass("highlight");
    $(this).next("div.content").toggle();
    });

    })
    </script>
    <style>
    .head{height:30px;line-height:30px;border:1px solid #000;background:#ccc;}
    .content{display:none;}
    .highlight{background:#ff3300;}
    </style>

    </head>

    <body>
    <div id="panel">
    <h5 class="head">什么是jQuery?</h5>
    <div class="content">
    jqueryjqueryjqueryjqueryjquerydfhdfdfgdgd时都会多难看开始的那款的那颗卡机的刷卡了
    </div>

    </div>
    </body>
    </html>

  • 相关阅读:
    PHP防止跨站表单提交与同站跨页伪造表单的攻击
    dz数据结构
    DiscuzX的目录权限设置1
    discuz 文档说明
    discuz x 系列目录结构说明
    验证码问题
    Discuz! X2验证码的产生及验证
    Discuz 升级X3问题汇总整理
    IIS7以上版本去掉伪静态去掉index.php方法
    Discuz 模板标签说明
  • 原文地址:https://www.cnblogs.com/ll-taj/p/5805943.html
Copyright © 2020-2023  润新知