Analysis of jquery animation Effects

Animate means: make angry; drive; Make vivid action; give... Take life
As an adjective: with life, live, angry, and vigorous

First look at the animation effect:
Http://keleyi.com/keleyi/phtml/jquery/index.htm


Animate () is used as a method in jquery to create animation effects.

The following is the instance code:

Jquery animate animation-ke leyi animate animation effect demonstration start animation scroll back painting Original article keleyi. comjquery modify link jquery pop-up form

Blog Park Plan

Definition and usage
The animate () method executes the Custom Animation of the CSS property set.
This method uses the CSS style to change an element from one state to another. The CSS attribute value is gradually changed, so that you can create an animation effect.
Only numeric values can be used to create animations (such as "margin: 30px "). The string value cannot be used to create an animation (for example, "background-color: red ").
Note: Use "+ =" or "-=" to create relative animations ).


Syntax 1
$ (Selector). animate (styles, speed, easing, callback)

Parameters

Styles
Required. Specifies the CSS style and value that produce the animation effect.
Possible CSS style values (for example ):
BackgroundPosition
BorderWidth
BorderBottomWidth
BorderLeftWidth
BorderRightWidth
BorderTopWidth
BorderSpacing
Margin
MarginBottom
MarginLeft
MarginRight
MarginTop
OutlineWidth
Padding
PaddingBottom
PaddingLeft
PaddingRight
PaddingTop
Height
Width
MaxHeight
MaxWidth
MinHeight
MinWidth
Font
FontSize
Bottom
Left
Right
Top
LetterSpacing
WordSpacing
LineHeight
TextIndent
Note: CSS styles are set using DOM names (such as "fontSize"), rather than CSS names (such as "font-size ").

Speed
Optional. Specifies the animation speed. The default value is "normal ".
Possible values:
Millisecond (e.g. 1500)
"Slow"
"Normal"
"Fast"

Easing
Optional. Specifies the easing function for setting the animation speed in different animation points.
Built-in easing functions:
Swing
Linear
More easing functions are provided in the extension plug-in.


Allback
Optional. The function to be executed after the animate function is executed.


Syntax 2
$ (Selector). animate (styles, options)

Styles is required. Specifies the CSS styles and values that generate the animation effect (same as above ).


Options
Optional. Specifies additional animation options.
Possible values:
Speed-set the animation speed
Easing-specifies the easing function to be used
Callback-specifies the function to be executed after the animation is completed
Step: Specify the function to be executed after each step of the animation is completed.
Queue-Boolean value. Indicates whether to place an animation in the effect queue. If false, the animation starts immediately.
SpecialEasing- ing of one or more CSS attributes from the styles parameter and their corresponding easing Functions

This article