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. 两台linux之间建立信任关系,实现免密码ssh远程登录或scp数据上传

    两台linux之间建立信任关系,实现免密码远程登录或数据上传 1.执行ssh-keygen命令,生成建立安全信任关系的证书: linux1上:执行命令  ssh-keygen  -t rsa 在程序提 ...

  2. Java虚拟机7:垃圾收集(GC)-2(并行和并发的区别)

    1.并发编程下 这两个名词都是并发编程中的概念,在并发编程的模型下的定义: 并发:是在同一个cpu上同时(不是真正的同时,而是看来是同时,因为cpu要在多个程序间切换)运行多个程序. 并行:是多个或同 ...

  3. SQL注入之PHP-MySQL实现手工注入-字符型

    SQL注入,就是通过把SQL命令插入到Web表单提交或输入域名或页面请求的查询字符串,最终达到欺骗服务器执行恶意的SQL命令.具体来说,它是利用现有应用程序,将(恶意的)SQL命令注入到后台数据库引擎 ...

  4. 前端在js中获取用户所在地区的时间与时区

    var times = Date() // 如果这种方式不行就使用 New Date() "Sat Jan 05 2019 10:35:24 GMT+0800 (中国标准时间)" ...

  5. 【小程序开放激励视频】--wepy小程序添加激励视频

    小程序开放激励视频是对小程序开发者一个福音,小程序开发者可以完成一些变现,以增加收入! 本文章针对已经有开发经验或者正在进行小程序开发的同学~ 官方文档:激励视频广告 定义页面变量,用于创建视频实例 ...

  6. Shell - 简明Shell入门09 - 重定向(Redirection)

    示例脚本及注释 #!/bin/bash pwd > 1.log # 输出重定向到指定文件 date 1> 1.log # ">"与"1>" ...

  7. ES6之Array.from()方法

    Array.from()方法就是将一个类数组对象或者可遍历对象转换成一个真正的数组. 那么什么是类数组对象呢?所谓类数组对象,最基本的要求就是具有length属性的对象. 1.将类数组对象转换为真正数 ...

  8. 使用命令行工具npm新创建一个vue项目

    使用vue开发项目的前期工作可以参考前面写的:  Vue环境搭建及node安装过程整理 Vue.js 提供一个官方命令行工具,可用于快速搭建大型单页应用.该工具提供开箱即用的构建工具配置,带来现代化的 ...

  9. Django 模版过滤器

    模版常用过滤器 在模版中,有时候需要对一些数据进行处理以后才能使用.一般在Python中我们是通过函数的形式来完成的.而在模版中,则是通过过滤器来实现的.过滤器使用的是|来使用.比如使用add过滤器, ...

  10. Jenkins配置项目

    前提:服务器上部署了jenkins+Tomcat,并且安装了所需插件 1.新建项目 -- 项目配置 2.配置git地址 出现上述错误是因为该git地址,在jenkins服务器上无权限访问.在git上开 ...