JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://tympanus.net/Blueprints/QuotesRotator/js/modernizr.custom.js"></script>
<div id="cbp-qtrotator" class="cbp-qtrotator">
    <div class="cbp-qtcontent">
        <img src="images/1.jpg" alt="img01" />
        <blockquote>
            <p>People eat meat and think they will become as strong as an ox, forgetting that the ox eats grass.</p>
            <footer>Pino Caruso</footer>
        </blockquote>
    </div>
    <div class="cbp-qtcontent">
        <!-- ... -->
    </div>
    <div class="cbp-qtcontent">
        <!-- ... -->
    </div>
    <div class="cbp-qtcontent">
        <!-- ... -->
    </div>
</div>

CSS

.cbp-qtrotator {
    position: relative;
    margin: 3em auto 5em auto;
    max-width: 800px;
    width: 100%;
    min-height: 400px;
}
.cbp-qtrotator .cbp-qtcontent {
    position: absolute;
    min-height: 200px;
    border-top: 1px solid #f4f4f4;
    border-bottom: 1px solid #f4f4f4;
    padding: 2em 0;
    top: 0;
    z-index: 0;
    opacity: 0;
    width: 100%;
}
.no-js .cbp-qtrotator .cbp-qtcontent {
    border-bottom: none;
}
/* Currently visible */
 .cbp-qtrotator .cbp-qtcontent.cbp-qtcurrent, .no-js .cbp-qtrotator .cbp-qtcontent {
    position: relative;
    z-index: 100;
    pointer-events: auto;
    opacity: 1;
}
.cbp-qtrotator .cbp-qtcontent:before, .cbp-qtrotator .cbp-qtcontent:after {
    content:" ";
    display: table;
}
.cbp-qtrotator .cbp-qtcontent:after {
    clear: both;
}
.cbp-qtprogress {
    position: absolute;
    background: #47a3da;
    height: 1px;
    width: 0%;
    top: 0;
    z-index: 1000;
}
.cbp-qtrotator blockquote {
    margin: 0;
    padding: 0;
}
.cbp-qtrotator blockquote p {
    font-size: 2em;
    color: #888;
    font-weight: 300;
    margin: 0.4em 0 1em;
}
.cbp-qtrotator blockquote footer {
    font-size: 1.2em;
}
.cbp-qtrotator blockquote footer:before {
    content:'? ';
}
.cbp-qtrotator .cbp-qtcontent img {
    float: right;
    margin-left: 3em;
}
/* Example for media query */
 @media screen and (max-width: 30.6em) {
    .cbp-qtrotator {
        font-size: 70%;
    }
    .cbp-qtrotator img {
        width: 80px;
    }
}

JavaScript

/**
 * jquery.cbpQTRotator.js v1.0.0
 * http://www.codrops.com
 *
 * Licensed under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * 
 * Copyright 2013, Codrops
 * http://www.codrops.com
 */;
(function ($, window, undefined) {

    'use strict';

    // global
    var Modernizr = window.Modernizr;

    $.CBPQTRotator = function (options, element) {
        this.$el = $(element);
        this._init(options);
    };

    // the options
    $.CBPQTRotator.defaults = {
        // default transition speed (ms)
        speed: 700,
        // default transition easing
        easing: 'ease',
        // rotator interval (ms)
        interval: 8000
    };

    $.CBPQTRotator.prototype = {
        _init: function (options) {

            // options
            this.options = $.extend(true, {}, $.CBPQTRotator.defaults, options);
            // cache some elements and initialize some variables
            this._config();
            // show current item
            this.$items.eq(this.current).addClass('cbp-qtcurrent');
            // set the transition to the items
            if (this.support) {
                this._setTransition();
            }
            // start rotating the items
            this._startRotator();

        },
        _config: function () {

            // the content items
            this.$items = this.$el.children('div.cbp-qtcontent');
            // total items
            this.itemsCount = this.$items.length;
            // current item´s index
            this.current = 0;
            // support for CSS Transitions
            this.support = Modernizr.csstransitions;
            // add the progress bar
            if (this.support) {
                this.$progress = $('<span class="cbp-qtprogress"></span>').appendTo(this.$el);
            }

        },
        _setTransition: function () {
            setTimeout($.proxy(function () {
                this.$items.css('transition', 'opacity ' + this.options.speed + 'ms ' +...