<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);

$("#cd1").toggle();
});
});
</script>
</head>

<body>

<p>演示带有不同参数的 fadeToggle() 方法。</p>
<button>点击这里，使三个矩形淡入淡出</button>
<br><br>
<div id="div1" style="width:80px;height:80px;background-color:red;"></div>
<br>
<div id="div2" style="width:80px;height:80px;background-color:green;"></div>
<br>
<div id="div3" style="width:80px;height:80px;background-color:blue;"></div>
</body>

</body>
</html>

toggle() 隐藏和收缩的更多相关文章

  1. 隐藏和显示效果js动画

    <div id='ctt' style='margin-left: 50px; color: white'>             <input type="button ...

  2. jQuery效果---隐藏与显示

    隐藏与显示 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"& ...

  3. ng动态显示和隐藏

    <!DOCTYPE html><html><head><meta charset="utf-8"><script src=&q ...

  4. jQuery的切换函数(hover,toggle)

    1.hover:(鼠标悬停与离开事件) 一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法.这是一个自定义的方法,它为频繁使用的任务提供了一种“保持在其中”的状态. 当鼠标移动到一个匹配的 ...

  5. jQuery 收缩展开效果

    <!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Conten ...

  6. jquery toggle()设置

    很多朋友对jquery toggle()比较熟练,甚至经常用到,而且对toggle的三个参数也比较了解$(selector).toggle(speed,callback,switch).但是当你设置$ ...

  7. extjs笔记

      1.    ExtJs 结构树.. 2 2.    对ExtJs的态度.. 3 3.    Ext.form概述.. 4 4.    Ext.TabPanel篇.. 5 5.    Functio ...

  8. jquery表格伸展

    1:效果图: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org ...

  9. 第七章 jQuery操作表格及其它应用

    1.表格变色 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org ...

随机推荐

  1. 数据库索引的基石----B树

    数据结构相对来说比较枯燥, 我尽量用最易懂的话,来把B树讲清楚.学过数据结构的人都接触过一个概念二叉树,简单来说,就是每个父节点最多有两个子节点.为了在二叉树上更快的进行元素的查找,人们通过不断的改进 ...

  2. mysql performance storage engine

    mysql performance storage engine 概要 mysql的运行时状态记录的存储引擎,实现了PSI(Performance Storage Interface) 通过WITH_ ...

  3. ES6模板字符串及字符串的扩展方法

    一.ES6模板字符串 传统定义字符串的方式是: const str='hello es2015,this is a string' ES6新增了一种定义字符串的方式用反引号进行标识 const str ...

  4. NVL函数：空值转换函数

    NVL(表达式1,表达式2) 如果表达式1为空值,NVL返回值为表达式2的值,否则返回表达式1的值. 该函数的目的是把一个空值(null)转换成一个实际的值.其表达式的值可以是数字型.字符型和日期型. ...

  5. js的函数-function

    function函数 function的英文是[功能],[数] 函数:职责:盛大的集会的意思 在js里,就是函数的意思.在Java里叫做方法. 定义函数 function fun(参数){ //函数体 ...

  6. explain extended；show warnings

    mysql> explain extended select count(*) from xuehao;+----+-------------+-------+------+---------- ...

  7. 【Oracle】row_number() over(partition by )函数用法

    row_number() OVER (PARTITION BY COL1 ORDER BY COL2) 表示根据COL1分组,在分组内部根据 COL2排序,而此函数计算的值就表示每组内部排序后的顺序编 ...

  8. kubernets之控制器之间的协作以及网络

    一  创建一个deployment的时候整个kubernets集群的资源和事件的调用链 1.1  创建一个deployment的资源,在提交的时候,集群中的调度器,控制器以及node节点上kubele ...

  9. AQS之ReentrantReadWriteLock精讲分析上篇

    1.用法 1.1 定义一个安全的list集合 public class LockDemo { ArrayList<Integer> arrayList = new ArrayList< ...

  10. 源代码增强的一点说明(souce code enhance )

    souce code enhance 分为显式和隐式两种. 下面以显式创建为例子: 1.在ABAP编辑器中, 打开想要编辑的程序,切换到可编辑模式 2.在源代码中的指定位置右键,弹出菜单,选择 Enh ...