JavaScript Toggle Widget Options

Action

toggle switches back and forth between activate and deactivate applies is-active to target.

default: 'toggle'
options: 'toggle', 'activate', 'deactivate'

---

Target

target a CSS selector.

default: ''
options: jQuery selector

---

Target Callback

target-callback is for when you need to call back to a selector but not have the selector cascade to its target. It allows a selector to be chained, without it having its targets or cascades also called. Most useful for group items to call back to a button or link.

default: ''
options: jQuery selector

---

Trigger

trigger type of event. Can also use trigger-activate and trigger-deactivate. Useful for a tooltip style if using mouseenter.

default: 'click'
options: accepts any javascript event, e.g. `mouseenter`, `mouseleave`

---

Trigger Type

trigger-type only activate if on element itself, not descendant. Example usage on .modal pattern. Prevents bubbling issue.

default: 'all'
options: 'all', 'direct-only'

---

Group

group is an arbitrary value that relates elements together. This is useful on .accordion or .tabs patterns.

default: ''
options: string

---

Stateful

stateful boolean to determine whether an element receives is-active or is-inactive classes. Example is a close button that doesn't need to maintain a state.

default: true
options: boolean(true/false)