Animate.css Demo

生成には以下Sassライブラリを利用させていただきました。
https://github.com/geoffgraham/animate.scss
そのため、サンプルコードはそのscssでの指定方法となります

.attention-seekers.bounce._on {@include bounce();}
.attention-seekers.flash._on {@include flash();}
.attention-seekers.jello._on {@include jello();}
.attention-seekers.pulse._on {@include pulse();}
.attention-seekers.rubberBand._on {@include rubberBand();}
.attention-seekers.shake._on {@include shake();}
.attention-seekers.swing._on {@include swing();}
.attention-seekers.tada._on {@include tada();}
.attention-seekers.wobble._on {@include wobble();}

.bouncing-entrances.bounceIn._on {@include bounceIn();}
.bouncing-entrances.bounceInDown._on {@include bounceInDown();}
.bouncing-entrances.bounceInUp._on {@include bounceInUp();}
.bouncing-entrances.bounceInLeft._on {@include bounceInLeft();}
.bouncing-entrances.bounceInRight._on {@include bounceInRight();}

.bouncing-exits.bounceOut._on {@include bounceOut();}
.bouncing-exits.bounceOutDown._on {@include bounceOutDown();}
.bouncing-exits.bounceOutUp._on {@include bounceOutUp();}
.bouncing-exits.bounceOutLeft._on {@include bounceOutLeft();}
.bouncing-exits.bounceOutRight._on {@include bounceOutRight();}

.fading-entrances.fadeIn._on {@include fadeIn();}
.fading-entrances.fadeInDown._on {@include fadeInDown();}
.fading-entrances.fadeInDownBig._on {@include fadeInDownBig();}
.fading-entrances.fadeInUp._on {@include fadeInUp();}
.fading-entrances.fadeInUpBig._on {@include fadeInUpBig();}
.fading-entrances.fadeInLeft._on {@include fadeInLeft();}
.fading-entrances.fadeInLeftBig._on {@include fadeInLeftBig();}
.fading-entrances.fadeInRight._on {@include fadeInRight();}
.fading-entrances.fadeInRightBig._on {@include fadeInRightBig();}

.fading-exits.fadeOut._on {@include fadeOut();}
.fading-exits.fadeOutDown._on {@include fadeOutDown();}
.fading-exits.fadeOutDownBig._on {@include fadeOutDownBig();}
.fading-exits.fadeOutUp._on {@include fadeOutUp();}
.fading-exits.fadeOutUpBig._on {@include fadeOutUpBig();}
.fading-exits.fadeOutLeft._on {@include fadeOutLeft();}
.fading-exits.fadeOutLeftBig._on {@include fadeOutLeftBig();}
.fading-exits.fadeOutRight._on {@include fadeOutRight();}
.fading-exits.fadeOutRightBig._on {@include fadeOutRightBig();}

.flippers.flip._on {@include flip();}
.flippers.flipInX._on {@include flipInX();}
.flippers.flipInY._on {@include flipInY();}
.flippers.flipOutX._on {@include flipOutX();}
.flippers.flipOutY._on {@include flipOutY();}

.lightspeed.lightSpeedIn._on {@include lightSpeedIn();}
.lightspeed.lightSpeedOut._on {@include lightSpeedOut();}

.rotating-entrances.rotateInDownLeft._on {@include rotateInDownLeft(); }
.rotating-entrances.rotateInDownRight._on {@include rotateInDownRight(); }
.rotating-entrances.rotateInUpLeft._on {@include rotateInUpLeft(); }
.rotating-entrances.rotateInUpRight._on {@include rotateInUpRight(); }

.rotating-exits.rotateOutDownLeft._on {@include rotateOutDownLeft(); }
.rotating-exits.rotateOutDownRight._on {@include rotateOutDownRight(); }
.rotating-exits.rotateOutUpLeft._on {@include rotateOutUpLeft(); }
.rotating-exits.rotateOutUpRight._on {@include rotateOutUpRight(); }

.sliding-entrances.slideInDown._on {@include slideInDown();}
.sliding-entrances.slideInUp._on {@include slideInUp();}
.sliding-entrances.slideInLeft._on {@include slideInLeft();}
.sliding-entrances.slideInRight._on {@include slideInRight();}

.sliding-exits.slideOutDown._on {@include slideOutDown();}
.sliding-exits.slideOutUp._on {@include slideOutUp();}
.sliding-exits.slideOutLeft._on {@include slideOutLeft();}
.sliding-exits.slideOutRight._on {@include slideOutRight();}

.specials.hinge._on {@include hinge();}
.specials.rollIn._on {@include rollIn();}
.specials.rollOut._on {@include rollOut();}

.zooming-entrances.zoomIn._on {@include zoomIn();}
.zooming-entrances.zoomInDown._on {@include zoomInDown();}
.zooming-entrances.zoomInUp._on {@include zoomInUp();}
.zooming-entrances.zoomInLeft._on {@include zoomInLeft();}
.zooming-entrances.zoomInRight._on {@include zoomInRight();}

.zooming-exits.zoomOut._on {@include zoomOut();}
.zooming-exits.zoomOutDown._on {@include zoomOutDown();}
.zooming-exits.zoomOutUp._on {@include zoomOutUp();}
.zooming-exits.zoomOutLeft._on {@include zoomOutLeft();}
.zooming-exits.zoomOutRight._on {@include zoomOutRight();}