jquery animate()方法 语法

作用：animate() 方法执行 CSS 属性集的自定义动画。该方法通过CSS样式将元素从一个状态改变为另一个状态。CSS属性值是逐渐改变的，这样就可以创建动画效果。只有数字值可创建动画（比如 "margin:30px"）。大理石平台怎么样字符串值无法创建动画（比如 " padding: 0px 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); line-height: 36px; background-color: rgb(242, 242, 242); color: rgb(102, 102, 102); font-family: "Helvetica Neue", Helvetica, "PingFang SC", 微软雅黑, Tahoma, Arial, sans-serif;">语法1：$(selector).animate(styles,speed,easing,callback)

参数：

参数 描述
styles     必需。规定产生动画效果的 CSS 样式和值。
speed     可选。规定动画的速度。默认是 "normal"。可能的值：毫秒 （比如 1500） "slow"  "normal"  "fast" 
easing     可选。规定在不同的动画点中设置动画速度的 easing 函数。内置的 easing 函数：swing   linear扩展插件中提供更多 easing 函数。
callback     可选。animate 函数执行完之后，要执行的函数。


语法2：$(selector).animate(styles,options)

参数：

参数 描述
styles     必需。规定产生动画效果的 CSS 样式和值（同上）。
options 可选。规定动画的额外选项。可能的值：speed - 设置动画的速度  easing - 规定要使用的 easing 函数  callback - 规定动画完成之后要执行的函数    step - 规定动画的每一步完成之后要执行的函数   queue - 布尔值。指示是否在效果队列中放置动画。如果为 false，则动画将立即开始   specialEasing - 来自 styles 参数的一个或多个 CSS 属性的映射，以及它们的对应 easing 函数

jquery animate()方法 示例

<html>

<head>

<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function()

  {

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

    $("#box").animate({height:"300px"});

  });

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

    $("#box").animate({height:"100px"});

  });

});

</script>

</head>

<body>

<div id="box" style="background:#98bf21;height:100px;width:100px;margin:6px;">

</div>

<button class="btn1">Animate</button>

<button class="btn2">Reset</button>

</body>

</html>

jquery animate()方法 语法的更多相关文章

  1. jquery clearQueue方法 语法

    jquery clearQueue方法 语法 作用:clearQueue() 方法停止队列中所有仍未执行的函数.与 stop() 方法不同,(只适用于动画),clearQueue() 能够清除任何排队 ...

  2. jQuery animate方法开发极客标签Logo动画融合效果

    在线演示 本地下载 jQuery的animate方法基础使用,演示如何生成一个jQuery animate方法开发极客标签Logo动画融合效果 相关代码录播:jQuery animate方法开发极客标 ...

  3. jquery fadeOut()方法 语法

    jquery fadeOut()方法 语法 作用:fadeOut() 方法使用淡出效果来隐藏被选元素,假如该元素是隐藏的.大理石平台精度等级 语法:$(selector).fadeOut(speed, ...

  4. jquery fadeIn()方法 语法

    jquery fadeIn()方法 语法 作用:fadeIn() 方法使用淡入效果来显示被选元素,假如该元素是隐藏的.大理石平台检定规程 语法:$(selector).fadeIn(speed,cal ...

  5. jquery unload方法 语法

    jquery unload方法 语法 作用:当用户离开页面时,会发生 unload 事件.具体来说,当发生以下情况时,会发出 unload 事件:点击某个离开页面的链接在地址栏中键入了新的 URL使用 ...

  6. jquery undelegate()方法 语法

    jquery undelegate()方法 语法 作用:undelegate() 方法删除由 delegate() 方法添加的一个或多个事件处理程序.大理石平台支架 语法:$(selector).un ...

  7. jquery unbind()方法 语法

    jquery unbind()方法 语法 作用:unbind() 方法移除被选元素的事件处理程序.该方法能够移除所有的或被选的事件处理程序,或者当事件发生时终止指定函数的运行.ubind() 适用于任 ...

  8. jquery trigger() 方法 语法

    jquery trigger() 方法 语法 作用:trigger() 方法触发被选元素的指定事件类型.深圳大理石平台 触发事件:规定被选元素要触发的事件. 语法:$(selector).trigge ...

  9. jquery toggle()方法 语法

    jquery toggle()方法 语法 作用:toggle() 方法用于绑定两个或多个事件处理器函数,以响应被选元素的轮流的 click 事件.该方法也可用于切换被选元素的 hide() 与 sho ...

随机推荐

  1. PHPexcel使用 技巧

    phpexcel不用多说了  导出表格时经常会用到  本帖主要记录一下几个经常用到的操作 # 设置自动换行 $PHPExcel->getActiveSheet()->getStyle(&q ...

  2. linux 百度ping不通解决

    很长时间没有使用Liunx了,上来发现linux上面没有办法ping百度了.(这样的问题>>..ping:www.baidu.com:Temporaryfailureinnameresol ...

  3. django form组件 cookies,session

    django form组件 渲染标签  就是组件里面的字段在前端展示叫做渲染标签 校验数据  用户输入的数据提交给后端组件叫做校验数据 forms组件中定义的字段都是必须传值的(required=Tr ...

  4. Tesseract机器识别

    1.合并图片打开jtessboxeditor,点击Tools->Merge Tiff ,按住shift键选择前文提到的101个tif文件,并把生成的tif合并到新目录d:\python\lnyp ...

  5. 《深入实践C++模板编程》之三——模板参数类型详解

    非类型模板参数 和 模板型模板参数 整数以及枚举类型:指向对象或者函数的指针:对对象或函数的引用:指向对象成员的指针.统称为非类型模板参数. 模板型模板参数,是指模板参数还可以是一个模板.   1.整 ...

  6. luogu P1552 [APIO2012]派遣 题解--可并堆/贪心

    题目链接: https://www.luogu.org/problemnew/show/P1552 分析: 一开始愣是没看懂题,后面发现就是你要找一个树上点集使得各点权值之和小于\(M\),并且找一个 ...

  7. MySQL学习笔记：count(1)、count(*)、count（字段）的区别

    关于数据库中行数统计,无论是MySQL还是Oracle,都有一个函数可以使用,那就是COUNT. 但是,就是这个常用的COUNT函数,却暗藏着很多玄机,尤其是在面试的时候,一不小心就会被虐.不信的话请 ...

  8. postgresql与mysql 优缺点

    MySQL的主要优点 (速度,流行,window,线程,事务) 1. 首先是速度,MySQL通常要比PostgreSQL快得多.MySQL自已也宣称速度是他们追求的主要目标之一,基于这个原因,MySQ ...

  9. Java高并发程序设计学习笔记（六）：JDK并发包(线程池的基本使用、ForkJoin)

    转自:https://blog.csdn.net/dataiyangu/article/details/86573222 1. 线程池的基本使用1.1. 为什么需要线程池1.2. JDK为我们提供了哪 ...

  10. ffmpeg处理视频命令

    一:视频添加图片水印 ffmpeg -i a.mp4 -vf "movie=a.jpg[watermark];[in][watermark] overlay=main_w-overlay_w ...