JSFiddle - React, Tailwind, and code Playground

by Ali Khaled

HTML

<script src="http://computeraxe.com/js/innerfade2.js"></script>


<div id="header-img-1">
<img src="http://medienfreunde.com/lab/innerfade/images/ggbg.gif" width="318" height="110" />
<img src="http://medienfreunde.com/lab/innerfade/images/whizzkids.gif" width="318" height="110" />
</div>

<div id="header-img-2">
<img src="http://medienfreunde.com/lab/innerfade/images/km.jpg" width="318" height="110" />
<img src="http://medienfreunde.com/lab/innerfade/images/tuev.jpg" width="318" height="110" />
</div>

<div id="header-img-3">
<img src="http://medienfreunde.com/lab/innerfade/images/rt_arch.jpg" width="318" height="110" />
<img src="http://medienfreunde.com/lab/innerfade/images/whizzkids.gif" width="318" height="110" />
</div>

CSS

div { margin-bottom:110px}

JavaScript

$(document).ready(

function() {
    $('#header-img-1').innerfade2({
        animationtype: 'fade',
        speed: 750,
        timeout: 1000,
        type: 'sequence',
        containerheight: '1em'
    });

    $('#header-img-2').innerfade2({
        animationtype: 'fade',
        speed: 750,
        timeout: 1000,
        type: 'sequence',
        containerheight: '1em'
    });

    $('#header-img-3').innerfade2({
        animationtype: 'fade',
        speed: 750,
        timeout: 1000,
        type: 'random_start',
        containerheight: '1em'
    });
});