JSFiddle - React, Tailwind, and code Playground
by bizamajig
HTML
<form>
<button>Slide In!</button>
<div>
<input type='text' />
<input type='submit' />
</div>
</form>
CSS
form {
position:relative;
width:250px;
}
form div {
position:absolute;
top:0;
left:-250px;
width:100%;
overflow:hidden;
transition:all .5s ease-in;
}
form div.active {
left:0;
}
JavaScript
$('button').on('click', function (event) {
event.preventDefault();
$('form div').addClass('active');
});