Animation
Easily add CSS animation to element / component. Click the play button to view sample animation.
bounce
animation animating bounce
flash
animation animating flash
pulse
animation animating pulse
rubberBand
animation animating rubberBand
shake
animation animating shake
swing
animation animating swing
tada
animation animating tada
wobble
animation animating wobble
bounceIn
animation animating bounceIn
bounceInDown
animation animating bounceInDown
bounceInLeft
animation animating bounceInLeft
bounceInRight
animation animating bounceInRight
bounceInUp
animation animating bounceInUp
bounceOut
animation animating bounceOut
bounceOutDown
animation animating bounceOutDown
bounceOutLeft
animation animating bounceOutLeft
bounceOutUp
animation animating bounceOutUp
hinge
animation animating hinge
rollIn
animation animating rollIn
rollOut
animation animating rollOut
Trigger animation if element / component visible in template viewport. This can be achieve with WayPoints plugins.
bounceIn
data-toggle="waypoints" data-showanim="bounceIn" data-hideanim="bounceOut" data-offset="80%"
fadeInDown
data-toggle="waypoints" data-showanim="fadeInDown" data-hideanim="fadeOutDown" data-offset="80%"
rotateIn
data-toggle="waypoints" data-showanim="rotateIn" data-hideanim="rotateOut" data-offset="80%"
slideInLeft
data-toggle="waypoints" data-showanim="slideInLeft" data-hideanim="slideOutRight" data-offset="80%"
rollIn
data-toggle="waypoints" data-showanim="rollIn" data-hideanim="rollOut" data-offset="80%"
rotateInDownLeft
data-toggle="waypoints" data-showanim="rotateInDownLeft" data-hideanim="rotateOutDownLeft" data-offset="80%"