Zen Animate

Free Joomla Extension - Joomla 2.5 / Joomla 3.0

Zen animate is a free Joomla plugin that adds css3 animation to your text. Simply wrap your text in one of the tags displayed below and the plugin will animate the text as it loads on the screen.

Zen Animate
css3-vector 




Using Zen Animate

Once you have installed and published the plugin open a content item where you want to use the style and use the syntax associated with the style you want to use.

eg {fadeUp}This text will use the fade up transition.{ /fadeUp}


List of available transitions.

  • flash
  • shake
  • bounce 
  • tada
  • swing
  • wobble
  • wiggle
  • pulse
  • flip
  • flipX
  • flipY
  • fade
  • fadeUp
  • fadeDown
  • fadeLeft
  • fadeRight
  • fadeUpBig
  • fadeDownBig
  • fadeLeftBig
  • fadeRightBig
  • bounce
  • bounceUp
  • bounceDown
  • bounceLeft
  • bounceRight
  • rotate
  • rotateUpLeft
  • rotateDownLeft
  • rotateUpRight
  • rotateDownRight
  • lightSpeedIn
  • lightSpeedOut
  • hinge
  • rollIn
  • rollOut

Developer Info

Change the transition duration

If you want to change the speed of the transition you can edit the following file and change the duration value marked at the top of the css file.

media/zenanimate/css/animate.css

Just change the default 1s declaration to a smaller or larger number to make the transition duration faster or slower.



Contribute or fork on Git Hub

This plugin is really designed to be a single purpose Joomla plugin. If you want to contribute to it's development feel free to contribute over at the Zen Animate github repo.



Big thanks to the Animate library

This plugin would not be possible without the animate.css library.

Happy Campers

Close