JSFiddle - React, Tailwind, and code Playground

by Peter Galiba

HTML

<img src="http://weblabor.hu/sites/all/themes/wl/images/wlheader.png" id="img">
<div id="time"></div>

JavaScript

var Effect = Effect || {};
var fadeOut = Effect.fadeOut = function(elem, ms) {
    var filter = 'opacity' in elem.style ? false : true,
        start = 100;
    if (filter) {
        elem.style.filter = 'alpha(opacity=' + start + ')';
    }
    else {
        elem.style.opacity = start / 100;
    }
    var interval = Math.round(ms / 50);
    var clock = document.getElementById('time');
    var startTime = (new Date).getTime();
    var timer = window.setInterval(function() {
        if (filter) {
            elem.style.filter = 'alpha(opacity=' + --start + ')';
        }
        else {
            elem.style.opacity = --start / 100;
        }
        if (start === 0) {
            clock.innerHTML = (new Date).getTime() - startTime
            window.clearInterval(timer);
        }
    }, interval);

};
window.onload = function() {
    var img = document.getElementById('img');
    Effect.fadeOut(img, 1000);
};