AnimateIt Stacks set

With the AnimateIt stacks set you can
very easily create cool and fun CSS3
based browser animations for a single
stacks element, predefined theme
elements and of course on all of your
custom HTML element. This stacks set
comes with over 50 predefined ready to
use animations.

Animate theme
element
Use this checkbox if you
would like to Animate one
of you theme elements and
show the following input
elements.

Element ID
The name of the theme
element that you would like
to Animate,
note that this should be an
ID according to the HTML
definitions.
So for example <div
id="content stroke"> as
used in the example
with the Sereno
Theme.

Event
You can select from the events
Hover, Click or
After page load. All
effects are added to the selected
Element using the AnimateIt
system scripts that performs it's
magic as soon as the page is
loaded by your browser.
Animation
Animations are displayed in the
Animations and Custom HTML
section of this manual.

Event
You can select from the
events Hover,
Click, On page
load or After page
load. All effects are
added to the selected
Element using the AnimateIt
system scripts that
performs it's magic as soon
as the page is loaded by
your browser. Except for
the On page load
event that is directly
handled by the browser
during page
loading.

Animations
Selecting the Animation is
as simple as selecting one
from the drop-down list
with the available
animations. Note that the
chosen Animation is only
added once for the selected
Event.

Custom
HTML
After adding the AnimateIt
Enclosure you can already
start using the Animations
during page load by adding
the AnimateItTrigger class
to your custom HTML
elements. Of course you
should also add the class
of the Animation that you
would like to use.

So for the fadeInRightBig
Animation we use the
following code:
<div
class="AnimateItTrigger
fadeInRightBig">....</div>

Note that the predefined
Animation classes are case
sensitive.

FAQ

The new Stacks plugin v2 comes
with a lot of new features for
3rd party developers, one of them
is the new drop-down input
element that we are using in the
AnimateIt stack for the selection
of Animations and Events.

AnimateIt Stacks Set

With the AnimateIt stacks set you can
very easily create cool and fun CSS3
based browser animations for a single
stacks element, predefined theme elements
and of course on all of your custom HTML
element. This stacks set comes with over
50 predefined ready to use animations
based on Animate.css
from Dan Eden. Check out his website
if you would like to use his cool
animations on other custom HTML and
CSS projects.

CSS animations are currently supported in
Apple Safari, Google Chrome, and Mozilla
Firefox. Microsoft promised support for
Internet Explorer 10, and support for
Opera 12 has been announced.