Click to Toggle Classes

This feature allows you to set it up so that clicking an element will add/remove classes from other elements.

Common use cases..

  • Change button style after the button is clicked.
  • Reveal an element that is hidden when another element is clicked.
  • Create card animations that will trigger on click instead of on hover.

There are only two settings..

Class to toggle – Name the class on the element wrapper that needs to be toggled on/off.

Trigger – Provide the selector of the element that will be clicked for the class to be toggled. (leave blank means this element will be used)

Pattern #1