JSFiddle - React, Tailwind, and code Playground
by tonytlwu
HTML
<div id="target1"></div>
<div id="target2"></div>
CSS
div {
float: left;
width: 25%;
height: 250px;
}
#target1 {
background-color: red;
}
#target2 {
background-color: green;
}
JavaScript
Promise.all([(function(){
return new Promise(function (resolve) {
$('#target1').animate({width: '50%'}, 400, resolve);
});
})(), (function(){
return new Promise(function (resolve) {
$('#target2').animate({width: '50%'}, 2000, resolve);
});
})()]).then(function(){
console.log('Both done');
});