JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>
<p>
  <input type="button" value="Toggle Width" />
</p>

CSS

div {
  width: 0;
  height: 100px;
  background-color: #00f;
  margin-bottom: 15px;
}

JavaScript

var expanded = false;
$('input').click(function() {
  $('div').stop();
  var duration;
  if (expanded) {
    duration = ($('div').width() / 100) * 1000;
    $('div').animate({ width: '0' }, { queue: false, duration: duration });
    expanded = false;
  } else {
    duration = ((100 - $('div').width()) / 100) * 1000;
    $('div').animate({ width: '100px' }, { queue: false, duration: duration });
    expanded = true;
  }
});