To get fade out effect just set:

animateOut: 'fadeOut'

fadeOut value is the only built-in CSS animate style. However there are tons of additional CSS animations that you can use in mightySlider. Simply download animate.css library and you are ready to extend mightySlider with new fancy transitions.


Animate functions work only with one item and only in browsers that support CSS3 Transitions.

Example with slideOutDown and flipInX

Example with random effects from a specific range

animateOut: ['slideOutDown', 'flipOutX', 'fadeOutDown', 'bounceOut', 'zoomOut'],
animateIn: ['flipInX', 'bounceIn', 'fadeInUp', 'zoomIn']