jQuery Toggle.js: Content Toggle And Accordion Demos

toggle sibling

By default, an element with the class js-toggle toggles its first sibling with class js-toggle-panel toggle sibling
I'm the first sibling panel; I wil get toggled
I'm the second sibling panel; I won't get toggled

toggle panel anywhere

toggle panel with data-toggle-panel-id="1" somewhere else in source code in the source code (the one width the yellowish background below)

Toggle multiple panels by id

toggle mulitple panels

I'm a panel with data-toggle-panel-id="2"
I'm a panel with data-toggle-panel-id="2" too
I'm a panel with data-toggle-panel-id="2" as well

toggle panel from anywhere

toggle panel with data-toggle-panel-id="1" below This panel can also be toggled from another toggle with the same data-panel-id above (the one with the yellowish background); both toggles update when one is clicked)

panel with data-toggle-panel-id="1"

Togglegroup (accordion): expanding one collapses the others


another toggle for toggle group - #1

If you want a toggle to only expand or collapse a panel, add the data-attribute data-toggle-expand-only or data-toggle-collapse-only

another toggle for toggle group - #1, with data-toggle-expand-only
another toggle for toggle group - #1, with data-toggle-collapse-only