1.三组基本的动画

  显示:show 、隐藏hide、滑入:slideUp、滑出:slideDown、滑入滑出切换:slideTpggle、淡入:fadeIn、淡出:fadeOut、淡入淡出切换:fadeToggle

  1.1show([speed],[callback])

    可选:speed-动画的持续时间,可以是毫秒,还可以是固定的字符串

    可选:callback-回调函数,动画结束后执行

  show();不传任何参数  直接显示      最常用

  show(1000);传入1000 动画会在1秒内全部完成

  show(1000,function(){alert("动画执行完毕")});

<style>
div{
width: 300px;
height: 300px;
background: pink;
display: none }
</style>
<body>
<div class="box"> </div> <script>
$(function(){
// $("div").show(); //直接显示div
// $("div").show(1000); //显示div会在1s内完成
$("div").show(1000,function(){
alert("动画执行完毕了");
}); //显示div会在1s内完成 随后会提示你动画执行完毕了
});
</script> </body>

  1.2hide([speed],[callback])    和show方法一样的参数效果

  1.3 slideUp(隐藏)、slideDown(出现)和show方法一样的参数   (不传入参数的时候会默认为400ms     有滑动效果)slideToggle滑入滑出切换(效果一样的,只是会来回的切换)

  1.4  fadeIn、fadeOut、fadeToggle:和slideUP...down一样的只是效果不一样。       

    

  

  

Jquery 基本动画的更多相关文章

  1. jquery animate 动画效果使用解析

    animate的意思是:使有生气:驱动:使栩栩如生地动作:赋予…以生命作为形容词:有生命的:活的:有生气的:生气勃勃的 先看动画效果:http://keleyi.com/keleyi/phtml/jq ...

  2. jQuery的动画处理总结

    最近一年多一直在做前端的东西,由于老板在追求一些年轻动感的效果,让页面元素不能仅仅是简单的隐藏显示,所以经常会使用一些动画效果,发现jQuery的动画真心好用啊,把常用的几个总结一下,希望不再每次使用 ...

  3. jQuery实现动画过程中尽量避免出现网页滚动条

    jQuery实现动画过程中尽量避免出现网页滚动条,不然可能会出现动画效果异常.

  4. jQuery Easing动画效果扩展(转)

    jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...

  5. jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

    一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...

  6. 精选7款绚丽的HTML5和jQuery图片动画特效

    在HTML5出现后,图片就变得更加富有动感了,各种图片动画特效也层出不穷,例如图片播放器.图片导航.3D图片动画等等.本文将精选几款具有代表性的HTML5和jQuery图片动画特效,绚丽的画面.实用的 ...

  7. jQuery之动画效果show()......animate()

    jQuery之动画效果 1.show()显示效果 语法:show(speed,callback) Number/String,Function speend为动画执行时间,单位为毫秒.也可以为slow ...

  8. jQuery 停止动画

    jQuery stop() 方法用于在动画或效果完成前对它们进行停止. 停止滑动 点击这里,向上/向下滑动面板 实例 jQuery stop() 滑动演示 jQuery stop() 方法. jQue ...

  9. 放弃使用jQuery实现动画

    在Web开发的圈子里,开发人员经常觉得CSS动画是一种高性能web动画技术.假设想让网页载入的更快一些,就应该用纯CSS动画.事实上这样的观点是错误的,非常多开发人员早就放弃了javascript的动 ...

  10. jQuery Easing 动画效果扩展

    jQuery API提供了简单的动画效果如淡入淡出以及自定义动画效果,而今天我给大家分享的是一款jQuery动画效果扩展增强插件jquery.easing.js,使用该插件可以实现直线匀速运功.变加速 ...

随机推荐

  1. Android-Java-Lock

    此篇博客已售票例子为例,所以首先看一个synchronized(同步锁机制)的案例 synchronized(同步锁机制)的案例 package android.java.thread19; /** ...

  2. C# .NET 获取枚举值的自定义属性

    一.定义一个类 using System; using System.Collections.Generic; using System.Linq; using System.Text; using ...

  3. ServiceStack DateTime数据类型转Json出现的困扰

    执行dotnet-new selfhost sstest 创建项目,然后打开解决方案 修改ssTest.ServiceModel中的Hello.cs,在HellopResponse中添加时间属性,然后 ...

  4. WPF MeasureOverride和 ArrangeOverride做个 页面导航

    public class NavigationPanel:Panel { protected override Size MeasureOverride(Size availableSize) { S ...

  5. 定时任务 Wpf.Quartz.Demo.2

    定时任务 Wpf.Quartz.Demo.1已经能运行了,本节开始用wpf搭界面. 准备工作: 1.界面选择MahApp.Metro 在App.xaml添加资源 <Application.Res ...

  6. Spring AOP 源码分析 - 创建代理对象

    1.简介 在上一篇文章中,我分析了 Spring 是如何为目标 bean 筛选合适的通知器的.现在通知器选好了,接下来就要通过代理的方式将通知器(Advisor)所持有的通知(Advice)织入到 b ...

  7. Swift5 语言参考(九) 泛型和参数

    本章介绍泛型类型,函数和初始值设定项的参数和参数.声明泛型类型,函数,下标或初始化程序时,可以指定泛型类型,函数或初始化程序可以使用的类型参数.当创建泛型类型的实例或调用泛型函数或初始化程序时,这些类 ...

  8. 人工智能-机器学习之numpy方法

    机器学习 最重要的东西就是算法   这里面的水很深  所以呢我就简单的整理了一下 基础的操作     #导入numpy库 as别名 为了怕重名 import numpy as np # 打印版本号 p ...

  9. odoo开发笔记 -- context上下文

    字段级别 视图级别 窗口动作级别

  10. gvim配置相关

    用 vundle 来管理 vim 插件(包含配置文件vimrc和gvimrc) gvim插件管理神器:vundle的安装与使用 Vim插件管理Vundle Linux 下VIM的配置 Vim配置系列( ...