JSFiddle - React, Tailwind, and code Playground

by gryzzly

HTML

<button>press me</button>
<div>
    lorem ipsum dolr sit lorem ipsum dolr sit lorem ipsum dolr sit lorem ipsum dolr sit lorem ipsum dolr sit 
</div>

CSS

div {
    overflow:hidden;
    background:#000;
    color:#fff;
    height:0;
    width:100px;
    -webkit-transition: height .5s linear;
    -moz-transition: height .5s linear;
    transition: height .5s linear;
}
.animated {
    height:auto;
    min-height:10px;
    max-height:100px;
}

JavaScript

$('button').bind('click', function(e) { 
    e.preventDefault();
    
    $('div').toggleClass('animated');
});