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. python安装OpenCV后import cv2报错解决办法

    现在python安装完成后,运行pip install opencv-python安装成功后,import cv2时会失败 看到有人给出下载https://www.lfd.uci.edu/~gohlk ...

  2. 合并两个排序链表——牛客offer

    题目描述: 输入两个单调递增的链表,输出两个链表合成后的链表,当然我们需要合成后的链表满足单调不减规则. 解题思路: 1.一般看到合并这类的题目就会很自然的想到创建一个新的链表,然后将两个链表根据一定 ...

  3. 牛客 158F 青蛙 (贪心)

    显然存在一个最优解满足所有青蛙在连续的一段, 每次由最左侧青蛙跳向下一格. 然后二分或者双指针即可求出答案. #include <iostream> #include <sstrea ...

  4. 三、maven学习-高级

    maven父子工程

  5. ubuntu18.3完美安装qq

    创建一个脚本全自动安装 #!/bin/bash # 安装 deepin-wine sudo mkdir deepin-wine deepin-qq cd deepin-wine git clone h ...

  6. vue打包后css背景图片地址找不到

    背景图片变成了这样:static/css/static/imgs/xxx.jpg 解决方法,修改build/utils,添加   publicPath: '../../'    就行 对比了下,com ...

  7. python:常用模块 知识整理

    time模块 time.time() # 时间戳:1487130156.419527 time.strftime("%Y-%m-%d %X") #格式化的时间字符串:'2017-0 ...

  8. JavaWeb【JSTL】

    根据JSTL标签所提供的功能,可以将其分为5个类别. 核心标签 格式化标签 SQL 标签 XML 标签 JSTL 函数 使用方式 1.下载包 地址:http://archive.apache.org/ ...

  9. jsonp的原理介绍及Promise封装

    什么叫jsonp? jsonp是json with padding(填充式json或参数式json)的简写,是通过ajax请求跨域接口,获取数据的新实现方式 jsonp的实现原理: 动态创建scrip ...

  10. fastadmin tp等模板变量在html中的js中如何使用？

    <script> var a = {$b} </script>