JSFiddle - React, Tailwind, and code Playground

HTML

<div id="growwer"><div>

CSS

#growwer{
    width:200px;
    height:200px;
    background-color:#00f;
    position:absolute;
    display:none;
}

#container{
    border:1px solid #666;
    width: 500px;
    height:500px;
}

JavaScript

jQuery.fn.center = function(parent, durationLength) {
    if (parent) {
        parent = this.parent();
    } else {
        parent = window;
    }
    this.animate({
        top: ((($(parent).height() - this.outerHeight()) / 2) + $(parent).scrollTop() + "px"),
        left: ((($(parent).width() - this.outerWidth()) / 2) + $(parent).scrollLeft() + "px")
    }, {duration: durationLength, queue: false});
return this;
}
    

$('#growwer').show("scale",{},3000).center(false, 3000);