<!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. js概念和ECMAScript

    概念 ​ ​就是一门浏览器客户端的脚本语言 运行在客户端浏览器中的,每一个浏览器都有JavaScript的解析引擎. 脚本语言,不需要编译,直接就可以被浏览器解析执行. 好处: ​ 可以增强一些用户的 ...

  2. Spring Boot 计划任务中的一个“坑”

    计划任务功能在应用程序及其常见,使用Spring Boot的@Scheduled 注解可以很方便的定义一个计划任务.然而在实际开发过程当中还应该注意它的计划任务默认是放在容量为1个线程的线程池中执行, ...

  3. C语言的类型大小

    C语言的类型大小 设计程序的时候我们一般会考虑的尽量的周全,尤其是像C这样的静态类型语言. 有一些溢出的问题就源于没有搞清楚变量的大小范围,所以我们编写的时候需要特别注意 C的整形(整数类型)大小 C ...

  4. LeetCode167 两数之和 II - 输入有序数组

    给定一个已按照升序排列 的有序数组,找到两个数使得它们相加之和等于目标数. 函数应该返回这两个下标值 index1 和 index2,其中 index1 必须小于 index2. 说明: 返回的下标值 ...

  5. Linux调整lvm逻辑分区大小

    转载自:https://www.cnblogs.com/kevingrace/p/5825963.html  个人记录一下   Linux下对lvm逻辑卷分区大小的调整(针对xfs和ext4不同文件系 ...

  6. 【Oracle】10g 11g下载路径

    现在直接点击不能下载了 要经过oracle许可才可以下载 如果嫌麻烦可以用迅雷直接下载密码是这个 一般不会动了 大家也不用帮我找回密码了 每次都改 也很麻烦的用迅雷下就不用密码了 下载也不会卡到最后 ...

  7. cursor pin s和cursor pin s wait on x

    1.cursor pin s是一个共享锁,一般情况下是因为发生在SQL短时间内大量执行 案例:在生产库中,突然出现大量的cursor pin s的等待,询问是否有动作后,同事说有编译存储过程(被误导了 ...

  8. [XAML] 使用 XAML 格式化工具：XAML Styler

    1. XAML 的问题 刚入门 WPF/UWP 之类的 XAML 平台,首先会接触到 XAML 这一新事物.初学 XAML 时对它的印象可以归纳为一个词:一坨. 随着我在 XAML 平台上工作的时间越 ...

  9. oracle 12C单实例打PSU

    前提: oracle不管打什么样的补丁,readme都是很好的参考资料. Oracle每季度都会更新一个最新的PSU,现在12.1.0.2.0的最新的PSU是Patch 26925311. 由于今天白 ...

  10. 编年史:OI算法总结

    目录(按字典序) A --A* D --DFS找环 J --基环树 S --数位动规 --树形动规 T --Tarjan(e-DCC) --Tarjan(LCA) --Tarjan(SCC) --Ta ...