吗?jQuery中动画的用法

  介绍

小编给大家分享一下jQuery中动画的用法,希望大家阅读完这篇文章后大所收获、下面让我们一起去探讨吧!

首先要了解jQuery API中动画的详细用法。

  动画:返回jQuery对象

动画(属性[时间][,缓解][完成])

<强>描述:根据一组CSS属性,执行自定义动画。

<强>一、动画(属性[时间][,缓解][完成])

  1,属性

类型:<强>

一个CSS属性和值的对象,动画将根据这组对象移动。

2,持续时间(默认:400)

类型:数字或字符串

一个字符串或者数字决定动画将运行多久。(默认值:“正常”;,字符串“slow",“中性”;,或“fast"或表示动画时长的毫秒数值(如:1000))

3,宽松(默认:swing)

类型:字符串

一个字符串,表示过渡使用哪种缓动函数。(jQuery自身提供“linear"和“swing")

4,完成

类型:函数()

在动画完成时执行的函数。

<强>二、动画(属性、期权)

  1,属性

类型:PlainObject

一个CSS属性和值的对象,动画将根据这组对象移动。

2, <强>

类型:PlainObject

一组包含动画选项的值的集合。支持的选项:

  1)、持续时间(默认:400)

类型:数字或字符串

一个字符串或者数字决定动画将运行多久。(愚人码头注:默认值:“正常”;,三种预定速度的字符串(“slow",“中性”,或“fast")或表示动画时长的毫秒数值(如:1000))

2),宽松(默认值:swing)

类型:字符串

一个字符串,表示过渡使用哪种缓动函数。(愚人码头注:jQuery自身提供“linear"和“swing",其他效果可以使用jQuery宽松插件插件)

3), <强> (默认值:true)

类型:布尔或字符串

一个布尔值,指示是否将动画放置在效果队列中。如果为假时,将立即开始动画。从jQuery1.7开始,队列选项也可以接受一个字符串,在这种情况下,在动画被添加到由该字符串表示的队列中。当一个自定义的队列名称被使用,动画不会自动启动;你必须调用.dequeue (“queuename")来启动它。

4), specialEasing

类型:PlainObject

由此方法的第一个参数属性定义的一个或多个CSS属性,及其相应的缓动函数组成的键值对地图。(1.4新增)

5), <强>

类型:功能(现在,渐变渐变)

每个动画元素的每个动画属性将调用的函数。这个函数为修改渐变对象提供了一个机会来改变设置中得属性值。

6), <强>

类型:功能(承诺动画,多进步,remainingMs)

每一步动画完成后调用的一个函数,无论动画属性有多少,每个动画元素都执行单独的函数。(1.8版本添加:)

7),完整的

类型:功能()

在动画完成时执行的函数。

8),完成

类型:功能(承诺动画,布尔jumpedToEnd)

在动画完成时执行的函数。(他的承诺对象状态已完成)。(版本补充道:1.8)

9),失败

类型:功能(承诺动画,布尔jumpedToEnd)

动画失败完成时执行的函数。(他的承诺对象状态未完成)。(1.8版本添加:)

10),总是

类型:功能(承诺动画,布尔jumpedToEnd)

在动画完成或未完成情况下停止时执行的函数。(他的承诺对象状态已完成或未完成)。(1.8版本添加:)

  一些基本的应用你可以参照jQuery API,或者参照jQuery API中文。

<强> 是本篇想要重点讲解的!

  <强> PlainObject

PlainObject类型,是Javascript对象包含0个或者跟多键值对。换句话说,PlainObject也是对象对象。但在jQuery文档中,被设计是为了区分其他多种Javascript对象。如空,用户自定义的数组,或者是主机对象向如文档,typeof值都是“对象”。通过jQuery.isPlainObject()方法来判断传入的的参数是否是PlainObject。

var=[];   var d=文档;   var o={};      typeof;//对象   typeof d;//对象   typeof o;//对象      jQuery。isPlainObject(一个);//错误   jQuery。isPlainObject (d);//错误   jQuery。isPlainObject (o);//真正的

<强>队列

  一个布尔值,指示是否将动画放置在效果队列中。如果为假时,将立即开始动画。

  它是来决定不同动画进行的顺序。

(“# block1")美元。动画({宽度:“90%”;},{队列:假的,持续时间:3000})   .animate({字形大小:“24 px"},1500)   .animate ({borderRightWidth:“15 px"},1500);   (“# block2"美元)。动画({宽度:“90%”;},1000)   .animate({字形大小:“24 px"},1000)   .animate ({borderLeftWidth:“15 px"},1000)、

吗?jQuery中动画的用法