JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<div class="main" id="main">
    <img src="http://lorempixel.com/600/500/sports/1/image 1" height="600" width="500">
    <img src="http://lorempixel.com/600/500/sports/2/image 2" height="600" width="500">
    <img src="http://lorempixel.com/600/500/sports/3/image 3" height="600" width="500">
    <img src="http://lorempixel.com/600/500/sports/4/image 4" height="600" width="500">
</div>

<div class="label" id="nextbutton"><img src="http://lorempixel.com/100/50/city/1/next"></div>
<div class="label" id="prevbutton"><img src="http://lorempixel.com/100/50/city/2/prev"></div>

JavaScript

var cycle = $('.main').cycle({
    fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
});

cycle.cycle("pause");


$("#nextbutton").live("click", function() {
    cycle.cycle("next");
});

$("#prevbutton").live("click", function() {
    cycle.cycle("prev");
});