Morphist

Morphing + List = Morphist

The simplest object rotator powered by jQuery and Animate.css

Download (v2.1.2) Source (GitHub)

Installation

1. Direct download link or via Bower:
bower install Morphist --save
2a. Import CSS (Prerequisite: Animate.css):
<link rel="stylesheet" href="bower_components/Morphist/dist/morphist.css">
2b. Import JS (Prerequisite: jQuery):
<script src="bower_components/Morphist/dist/morphist.min.js"><script>

Usage

3. HTML (Example):
I am a...
<ul id="js-rotating">
    <li>So Simple</li>
    <li>Very Doge</li>
    <li>Much Wow</li>
    <li>Such Cool</li>
</ul>
...child object rotator.
4. Initiate and customise (JS):
$("#js-rotating").Morphist({
    // The entrance animation type (In).
    animateIn: "tada",
    // The exit animation type (Out). Refer to Animate.css for a list of available animations.
    animateOut: "bounceOut",
    // The delay between the changing of each object in milliseconds.
    speed: 2000,
    complete: function () {
        // Called after the entrance animation is executed.
    }
});

Preview (Tweets from @iamdevloper)