JSFiddle - React, Tailwind, and code Playground

by paulsocal

HTML

<div id="box"></div>

CSS

#box{
    width:100px;
    height:100px;
    background:red;
}

#box.animate{
    -webkit-transform: translateX(100px);
    opacity: 0;
    -webkit-transition: 4s -webkit-transform 1s, 4s opacity 1s;
}

JavaScript

var box = document.getElementById('box');

box.addEventListener('webkitTransitionEnd', function(){
    alert('done');
}, false);

box.addEventListener('click', function(){
    window.open('http://google.com');
}, false);

box.classList.add('animate');