JSFiddle - React, Tailwind, and code Playground

by robaldred

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.11.7/TweenMax.min.js"></script>
<div id="container">
    
</div>

CSS

#container {
    position: relative;
}
.icon {
    position: absolute;
    display: none;
    width:10em;
    height:10em;
    background:red;
}

JavaScript

elm = $('<div>')
elm.addClass('icon')

TweenLite.set(elm,{
    css: {
        left:"50px",
        top:"50px"
    }
})


$('#container').append(elm)
elm.show()

TweenLite.to(elm, 2, {
    delay: 1,
    css: {
        left: "+=50px",
        top: "+=50px"
    },
    ease: Bounce.easeInOut
});