Skip to content

flextype-plugins/animate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Animate Plugin for Flextype

version Flextype MIT License

Animate plugin allows you to animate almost everything on your site with help of powerful animate.css library.

Installation

Unzip plugin to the folder /site/plugins/

Usage in page content

Basic usage

[animate]Text with animation[/animate]

Usage with parameters

[animate type="pulse" duration=1 delay=0 inline="yes" class="class-name"]Text with animation[/animate]

Parameters

type - set animation type. Default value is bounceIn

possible values:

bounce, flash, pulse, rubberBand, shake, headShake, swing, tada, wobble, jello, bounceIn, bounceInDown, bounceInLeft, bounceInRight, bounceInUp, bounceOut, bounceOutDown, bounceOutLeft, bounceOutRight, bounceOutUp, fadeIn, fadeInDown, fadeInDownBig, fadeInLeft, fadeInLeftBig, fadeInRight, fadeInRightBig, fadeInUp, fadeInUpBig, fadeOut,fadeOutDown, fadeOutDownBig, fadeOutLeft, fadeOutLeftBig, fadeOutRight, fadeOutRightBig, fadeOutUp,fadeOutUpBig,flipInX,flipInY flipOutX,flipOutY,lightSpeedIn,lightSpeedOut, rotateIn, rotateInDownLeft, rotateInDownRight, rotateInUpLeft, rotateInUpRight, rotateOut, rotateOutDownLeft, rotateOutDownRight, rotateOutUpLeft, rotateOutUpRight, hinge, jackInTheBox, rollIn, rollOut, zoomIn, zoomInDown zoomInLeft, zoomInRight, zoomInUp, zoomOut, zoomOutDown, zoomOutLeft, zoomOutRight, zoomOutUp, slideInDown, slideInLeft, slideInRight, slideInUp, slideOutDown, slideOutLeft, slideOutRight, slideOutUp

duration - set animation duration (seconds). Default value is 1

possible values: Number from 0 to 20

delay - set animation delay (seconds). Default value is 0

possible values: Number from 0 to 20

inline - this parameter determines what HTML tag will be used for animation wrapper. Turn this option to YES and animated element will be wrapped in SPAN instead of DIV. Useful for inline animations, like buttons. Default value is no

possible values: yes or no

class - Additional CSS class name(s) separated by space(s)

Usage in the template

<div class="animated bounce">Text with animation</div>

Settings

enabled: true # or `false` to disable the plugin

License

See LICENSE

About

Animate plugin allows you to animate almost everything on your site with help of powerful animate.css library.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages