<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="utf-8"/>

    <title></title>

    <script src="../js/jquery-1.10.2.js"></script>

    <script>

        $(function(){

            $("input").click(function(){

                $("div").hide(3000);

                $("div").show(3000);

                $("div").toggle(3000);

                //上面三个改变的是长，宽和透明度

                $("div").slideDown(3000);

                $("div").slideUp(3000);

                $("div").slideToggle(3000);

                //上面三个改变的是长

                $("div").fadeIn(3000);

                $("div").fadeOut(3000);

                $("div").fadeTo(3000,0.3);

                $("div").fadeToggle(3000);

                //上面四个改变的是透明度，但是需要注意上面这四种方法中div从display：none;直接变成有长宽的透明度为零的块级元素，然后在改变透明度

            })

        })

    </script>

    <style>

        div{width:200px;height:200px;background-color: blue;

            display: none;

        }

    </style>

</head>

<body>

    <div></div>

    <input type="button" value="点我"/>

</body>

</html>

jquery的各种隐藏显现动画的区别的更多相关文章

  1. jquery中使元素显示和隐藏方法之间的区别

    在实际的项目开发中,要使一个元素隐藏的方法有很多,比如css的多种属性和jquery的多种方法,虽然他们的作用都是使元素不可见,但是各个方法实现的原理是不一样的.下面主要介绍jquery各个元素隐藏方 ...

  2. JQuery: JQuery效果（隐藏、显示、切换，滑动，淡入淡出，以及动画）

    JQuery:效果 JQuery效果有很多,包括隐藏.显示.切换,滑动,淡入淡出,以及动画等.隐藏:JQuery hide() 显示:JQuery show() 切换:JQuery toggle() ...

  3. jQuery效果：隐藏、显示、切换、滑动、淡入淡出、动画

    jQuery效果 隐藏.显示.切换.滑动.淡入淡出.以及动画 1.隐藏与显示(改变:display:none;) hide()--隐藏 show()--显示 toggle()方法:可以使用它来切换hi ...

  4. jQuery中的事件与动画 (你的明天Via Via)

    众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, ...

  5. jQuery中的事件和动画——《锋利的jQuery》（第2版）读书笔记2

    第4章 jQuery中的事件和动画 jQuery中的事件 加载DOM $(document).ready(function(){   // 编写代码... }); 可以简写成: $(function( ...

  6. jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别

    大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...

  7. JQuery制作网页—— 第七章 jQuery中的事件与动画

    1. jQuery中的事件: ●和WinForm一样,在网页中的交互也是需要事件来实现的,例如tab切换效果,可以通过鼠标单击事件来实现 ●jQuery事件是对JavaScript事件的封装,常用事件 ...

  8. Jquery库自带的动画效果方法记录

    1.显示和隐藏hide()和show() <script type="text/javascript">             $(function() {      ...

  9. 第三章 jQuery中的事件与动画

    第三章jQuery中的事件与动画 一. jQuery中的事件 jQuery事件是对javaScript事件的封装. 1.基础事件 在javaScript中,常用的基础事件有鼠标事件.键盘事件.wind ...

随机推荐

  1. C语言： 预处理

    1. 字符映射 键盘有多种标准规格,例如常用的IBM 104键盘标准,然而不是所有键盘都能打出像#这样的符号,因此C语言的预处理引入了字符映射机制.如果程序员要求,预处理会按照约定对源代码中的字符进行 ...

  2. 更新整理本人所有博文中提供的代码与工具（C++，2014.01）

    为了更方便地管理博文中涉及的各种代码与工具资源,现在把这些资源迁移到 Google Code 中,有兴趣者可前往下载. C++ 1.<通用高性能 Windows Socket 组件 HP-Soc ...

  3. [转]看部电影，透透彻彻理解IoC(你没有理由再迷惑!)

    之前对依赖注入的概念一直感到模糊,直到看了这篇文章:http://www.iteye.com/topic/1122835 引述: IoC(控制反转:Inverse of Control)是Spring ...

  4. IIS6.0添加上.net4.0后，以前的.net系统出现“服务器应用程序不可用”的错误提示解决办法

    把VS2010开发的网站.net4.0部署到Windows Server 2003的服务器上去, Windows Server 2003操作系统自带的为IIS 6.0,IIS 6.0一般只支持.NET ...

  5. 实现bootstrap布局的input输入框中的图标点击功能

    使用bootstrap布局可以在input的输入框中添加譬如登录名输入框中的一键清除图标和密码输入框中显示密码的小眼睛图标.如下图: 但是在将图标放入input输入框中,这些小图标是无法获得点击事件的 ...

  6. Linux学习心得之 linux命令

    作者:枫雪庭 出处:http://www.cnblogs.com/FengXueTing-px/ 欢迎转载 前言 本篇博客是对 每日一linux命令(http://www.cnblogs.com/pe ...

  7. 地理数据库 (Geodatabase) 版本管理

    版本化地理数据库包含一些非版本化地理数据库中不存在的附加表格和记录.这些附加表和记录有助于长时间执行并行编辑.如果不进行版本化处理,则编辑者需要锁定数据并防止其他用户对数据进行编辑或查看.要使用此功能 ...

  8. 基础理解1:JSONP

    首先要确认三点: 1.不要被名字误导,返回的格式是随意的string,int等 2.JSONP用的是Script标签跨域的特性 3.回调函数名字和请求参数问题,不要被众多文章中的callback误导, ...

  9. iOS--KVO的概述与使用

    一.概述 KVO,即:Key-Value Observing,它提供一种机制,当指定的对象的属性被修改后,则对象就会接受到通知.简单的说就是每次指定的被观察的对象的属性被修改后,KVO就会自动通知相应 ...

  10. 如何在 ASP.NET 4.6 与 IIS10 中运用 HTTP/2 ？

    在过去十年中,Web 技术已经取得了种种进展.从基本的 HTML 开始,网页发展出更丰富的外观和感觉,变得更加直观,对用户更加友好并且越来越大放异彩.这些变化的关键贡献来自于一些新的和翻新技术,且借力 ...