Collapsible

Flexible plugin that utilise a handful of classes to toggles panels.

Remark provides a simple and effective way to extend a collapsible behavior to any panel component in the column you select.

How it works

For the best User Experience

You should use Collapsible with Panels enabled.

<script>
$js(function () {
  $js('body').remarkable({
     panels: true,
     collapsible: true
  });
});
</script>

By default, the collapsible option, by itself, just applies some basic icons to indicate when the panel is collapsed or open.

Also using Tabbable?

<script>
$js(function () {
  $js('body').remarkable({
     panels: true,
     collapsible: true,
     tabbable: true
  });
});
</script>

Not an issue, however, tabbable and collapsible cannot be enabled at the same time on the same column.

Via Panel class

If you do not want all Panels in the same column to be collapsible, you can add the remark-collapsible class to the Panel to automatically make that Panel only collapse in the column.