JSFiddle - React, Tailwind, and code Playground

by Amatewasu

HTML

<img src="http://icones.pro/go.php?http://icdn.pro/images/fr/t/w/twitter-popup-bulle-info-icone-5035-64.png" class="logo" id="twitter" /><img src="http://icones.pro/go.php?http://icdn.pro/images/fr/f/a/facebook-icone-4148-64.png" class="logo" id="facebook" />
<img src="http://icones.pro/go.php?http://icdn.pro/images/fr/a/p/appt-mail-icone-3850-64.png" class="logo" id="mail" />
<img src="http://icones.pro/go.php?http://icdn.pro/images/fr/l/i/linkedin-utilisateur-icone-9587-64.png" class="logo" id="in" />

CSS

body {
    padding: 100px;
    overflow: hidden;
}

.logo {
    position: relative;
    top: -200px;
    left: 200px;
    
    -webkit-transition: all 2s ease;
}

JavaScript

function foo (id){
    a = document.getElementById(id);
    
    a.style.top = "0px";
    
    setTimeout(function (){
        a.style.left = "0px";
    }, 1000);
    
}

foo("twitter");
setTimeout(function (){
    foo("facebook");
}, 1500);
setTimeout(function (){
    foo("mail");
}, 3000);
setTimeout(function (){
    foo("in");
}, 4500);