JSFiddle - React, Tailwind, and code Playground

by intrinsica

HTML

<div class="box"></div>
<button class="toggle">Toggle Visibility</button>

CSS

.box {
    background: red;
    width: 100px;
    height: 100px;
    opacity: 1;
    transition: opacity 2s, height 1s;
}

.hidden {
    opacity: 0;
    transition: opacity 2s, height 1s;
    height: 0;
}

JavaScript

$(function() {
    $('.toggle').click(function() {
        $('.box').toggleClass('hidden'); 
    });
});