JSFiddle - React, Tailwind, and code Playground

by serio

HTML

<div class='top'>
    <a href='#'>toggle</a>
</div>

CSS

.top {
 background: #EAEAEA;
 min-height: 200px;

-webkit-transition-property: height;
-webkit-transition-duration: .4s;
-webkit-transition-timing-function: cubic-bezier(0.075, 0.820, 0.165, 1.000);    
}

.top a {
 font-size: 11px;
background: #000;
 color: #FFF;
padding: 10px 6px;    
}

JavaScript

$(function() {
    var toggle = $('.top a')
    var target = $('.top')

    toggle.toggle(function() {
        console.log('wat')

        target.css('height', target.height());

        target.css('height', '0px');


    }, function() {
        console.log('yeaaa!')
    });
});