<!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. Visual Studio中UnitTesting单元测试模板代码生成

             在软件研发过程中,单元测试的重要性直接影响软件质量.经验表明一个尽责的单元测试方法将会在软件开发的某个阶段发现很多的Bug,并且修改它们的成本也很低.在软件开发的后期阶段,Bug的发 ...

  2. IT基础架构规划方案之实际网络设计案例

    根据某集团总部新办公大楼.厂房和分支机构(店面)的情况,以及IT部门对网络节点数.网络应用和分支机构(店面)的初步规划,对企业的总体网络拓扑结构进行设计,如下图. 设备选型和部署参考: 类型 设备选型 ...

  3. 24、ASP.NET MVC入门到精通——数据库仓储

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 业务层调用数据层对象,我不想每次都new一个数据层对象,而是在数据层创建一个仓储,统一管理所有的对象调用. 1.在IDAL项目中,新建IDB ...

  4. 线程.FTP.SFTP.打包

    Windows就是多线程模式.每一个解决方案就是一个进程.一个进程下拥有多个线程. 简单点.单核的处理器不存在多线程.是CPU在每一个线程上切换处理.在人反应不过来的情况下完成同步的效果. 比如左手画 ...

  5. 异常处理的解决方案 OneTrueError

    应用程序安装在用户计算机上,异常处理一直是反复出现的问题.用户报障中的描述不足以重现该问题.你不得不猜测,或者只是做猴子测试,以找出其异常出现的根源. 最严重的问题是当认为你已经找出了原因并纠正它,但 ...

  6. 关于腾讯云ubuntu服务器tomcat访问慢问题

    在腾讯云上配了个一元的学生云,开始一切正常,直到配置tomcat开始出现各种莫名其妙的问题.最莫名其妙的是tomcat启动了,端口也 正常监听,安全组也放行端口了,然后问题来了. 用浏览器访问tomc ...

  7. chrome 调试 SASS

    第一步: 执行sass预编译命令 先来我的项目文件夹结构: ->进入sass /css文件下->打开cmd命令 ->输入sass --watch --scss  test.scss: ...

  8. php 7.0 安装以及老版本php删除

    一, 安装php7 php7对php5是99%的兼容, 而且性能更好, 网上很多的优秀的库都对版本有一定的要求, 所以推荐安装php7 低于ubuntu 16.04的系统默认的源不带php7, 所以需 ...

  9. Xcode8开发iOS10推送通知过程

    iOS10发布后,简书优先开发增加了iOS10的新通知.本文分享整个feature的开发过程遇到的问题. 1.工程配置 Xcode8发生了很大的变化,直接打开原来的工程编译运行,这个时候是获取不到Pu ...

  10. 机器人聊天的小Demo

    先来张图,看看我们要做成什么样的效果.很简单的一个发送消息接收消息的界面,那怎么实现的呢,毫无疑问,是ListView的多布局了,右边显示我们发送消息的条目,左边显示要接收消息的条目.下面是一个Edi ...