<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.min.js" ></script>
    <style type="text/css">
        .panel{display:none;}
        .panel,.flip{background:#e5eecc; border:solid 1px #c3c3c3;}
    </style>
</head>
<body>
    <div class="panel">在 W3School,你可以找到你所需要的所有网站建设教程。</div>
    <div class="flip">请点击这里</div>
    <script type="text/javascript">
        $(".flip").click(function(){
            $(".panel").slideToggle("slow");
        });
    </script>
</body>
</html>

效果预览下载:http://pan.baidu.com/s/1bob1h7L

jQuery slideDown()--向下滑动的更多相关文章

  1. jquery 连写注释;siblings() 方法;jQuery 的3种滑动方法;slideUp()向上滑动;slideDown()向下滑动;slideToggle()来回滑动

    首先我们看两个连写注释 第一个:   /* 点击头像,显示基本资料 */ $(".f-chatTit a.avatar").click(function(){ $(this).hi ...

  2. jQuery 滑动方法slideDown向下滑动元素

    通过 jQuery可以在元素上创建滑动效果,jQuery slideDown() 方法用于向下滑动元素. jQuery 滑动方法 通过 jQuery,您可以在元素上创建滑动效果. jQuery 拥有以 ...

  3. jQuery 移动端ajax请求列表数据,实现点击翻页效果(还有手势往下滑动翻页)。

    1 首先是html部分 <div class="content"> <div class="list"></div>  // ...

  4. 使用 jQuery 和 CSS3 制作滑动导航菜单

    这个下拉菜单可以让你的网站非常优雅,滑动框导航效果令人印象深刻.此外,子菜单框也可以与此集成起来以使其更具吸引力.导航是网站成功的关键之一,有吸引力的导航能够引导用户浏览网站中的更多内容. 效果演示  ...

  5. jquery实现多级下拉菜单

    支持多种浏览器,体验效果:http://keleyi.com/keleyi/phtml/jqmenu/4.htm 多级菜单,理论上支持无限多的层级,文件结构非常简单的,以下是完整代码: <!DO ...

  6. jQuery 实现上下,左右滑动

    前几天的任务:http://t.sina.com.cn/  的下滑效果. 渐变移动出足够的空白 -> 淡出最后一个 ->渐变移动出足够的空白 我们要做的是向左移动效果.这个效果用时需添加一 ...

  7. jQuery超酷下拉插件6种效果演示

    原始的下拉框很丑啦, 给大家一款jQuery超酷下拉插件6种效果 效果预览 下载地址 实例代码 <div class="container"> <section ...

  8. WP8_GestureListener实现列表向下滑动加载新数据

    利用GestureListener的OnDragCompleted事件,实现列表向下滑动时,加载新的数据: (不建议使用 Touch.FrameReported+=Touch_FrameReporte ...

  9. 基于jQuery美化联动下拉选择框

    今天给大家介绍一款基于jQuery美化联动下拉选择框.这款下下拉选择框js里自带了全国所有城市的数数库.下拉选择框适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲 ...

随机推荐

  1. div、span

    1.Html区块元素 HTML可以通过<div>和<span>将元素组合起来 大多数HTML元素被定义为块级元素或内联元素, 而块级元素在浏览器显示时,通常会以新行来开始(或结 ...

  2. Linux界面自动化测试框架不完全汇总

    首先可参考wiki此文,非常详尽:https://en.wikipedia.org/wiki/List_of_GUI_testing_tools 以下是我调研并实验过的(实验环境ubuntu 16.0 ...

  3. kmp//呵呵!看毛片算法

    以前刚学的时候迷迷糊糊的,一看就懵圈,前几天捡起来的时候 发现还不会 于是研究了两天,自尊心严重受挫,今天的时候  突然一道灵光迸发,居然 感觉好像懂了,于是又琢磨起来  终于  我懂了  呵呵!   ...

  4. HashMap和Hashtable的同和不同

    一.综述 可以直接根据hashcode值判断两个对象是否相等吗?肯定是不可以的,因为不同的对象可能会生成相同的hashcode值.虽然不能根据hashcode值判断两个对象是否相等,但是可以直接根据h ...

  5. InnoDB引擎数据存放位置

    InnoDB引擎的mysql数据存放位置 采用InnoDB引擎的数据库创建表后,会在mysql数据存放目录下生成一个和数据库名相同的目录.该目录下包涵一个db.opt文件和该库下所有表同名的frm文件 ...

  6. node-canvas

    1.使用之前需要预先安装  Cairo 本人安装遇到各种各样的坑,可以参考这里来填坑:https://github.com/Automattic/node-canvas/wiki/Installati ...

  7. 驱动7段LED显示器

    拿到7段LED显示器,先看看是共阴极还是共阳极,如果是共阳极,3和8接5V,5V串联一个220欧姆的电阻. 下面是购买的LED显示器的接线图例 5V串联电阻图例 下面为代码,此代码将实现在LED显示器 ...

  8. 面试题-Java基础-面向对象

    1.面向对象软件开发的优点有哪些? 代码开发模块化,更易维护和修改.代码复用.增强代码的可靠性和灵活性.增加代码的可理解性.面向对象编程有很多重要的特性,比如:封装,继承,多态和抽象.下面的章节我们会 ...

  9. 命令行解决mysql中文乱码

    修改my.ini文件中的 [mysql] default-character-set=gbk [mysqld] # The default character set that will be use ...

  10. MQTT协议之 Apache Apollo服务

    一.说明 MQTT是IBM开发的一个即时通讯协议,有可能成为物联网的重要组成部分.该协议支持所有平台,几乎可以把所有联网物品和外部连接起来,被用来当做传感器和致动器(比如通过Twitter让房屋联网) ...