JSFiddle - React, Tailwind, and code Playground

HTML

<div id="images"></div>

CSS

#images{
    margin: 20px auto;
    border: 3px solid #eee;
    width: 400px;
    height: 400px;
}
body{
    background: #333;
}

JavaScript

$(document).ready(function () {
    var src = ['http://ghiboo.com/assets/modules/article/images/big/4c85f8da99fa1.jpg',
        'http://media.realitatea.ro/multimedia/image/200908/w298/image_125017793013502600_1.jpg',
        'http://www.publispain.com/bugatti-veyron/imagenes/foto4.jpg',
        'http://4.bp.blogspot.com/_OvAqHDpS-3w/SnM-00RDchI/AAAAAAAAC4k/6AXeQOH43oU/s400/bugatti2.jpg'];
    var slide = 0;
    var img = new Image();
    document.getElementById('images').appendChild(img);

    function slideit() {
        img.style.opacity = 0;
        img.src = src[slide % 4];
        img.onload = function () {
            $('#images img').animate({
                'opacity': 1
            }, 500);
            slide++;
        };
        setTimeout(slideit, 3500);
    }
    slideit();
});