Template:Animation/doc

This is the documentation page for Template:Animation.

This template displays an animation using multiple images as frames.

The template uses CSS to shuffle between images like a film strip.

Generally, it is more preferrable to use animated WebP or GIF instead.

Usage

Basic

{{Animation
|fps=4
|size=80px
|acerth_down_walk_0 - evocreo2.png
|acerth_down_walk_1 - evocreo2.png
}}

Changing container size

{{Animation
|fps=4
|size=80px
|width=40px
|height=40px
|acerth_down_walk_0 - evocreo2.png
|acerth_down_walk_1 - evocreo2.png
}}

Offseting frame position

{{Animation
|fps=4
|size=80px
|width=40px
|height=40px
|offsetTop = -4px
|offsetLeft = -1px
|offsetRight = -2px
|offsetBottom = 1px
|acerth_down_walk_0 - evocreo2.png
|acerth_down_walk_1 - evocreo2.png
}}

TemplateData

Displays an animation using multiple images as frames

Template parameters
This template prefers inline formatting of parameters.
Parameter		Description	Type	Status
Frame 1	`1`	Image for the first frame Example acerth_down_walk_0 - evocreo2.png	File	required
Frame 2	`2`	Image for the second frame Example acerth_down_walk_1 - evocreo2.png	File	required
Size	`size`	Size of the image Default 80px Example 80px	String	optional
FPS	`fps`	FPS of the animation Default 12 Example 12	Number	optional
Container width	`width`	The width of the container containing the frame. This is useful for clipping whitespace from the animation. Default to the size parameter. Example 40px	String	optional
Container height	`height`	The height of the container containing the frame. This is useful for clipping whitespace from the animation. Default to the size parameter. Example 40px	String	optional
Top offset	`offsetTop`	Top position offset for the frame Default 0 Example -2px	String	optional
Bottom offset	`offsetBottom`	Bottom position offset for the frame Default 0 Example -2px	String	optional
Left offset	`offsetLeft`	Left position offset for the frame Default 0 Example -2px	String	optional
Right offset	`offsetRight`	Right position offset for the frame Default 0 Example -2px	String	optional