Styleguide Navigation

Collapsible

Open via inline link (1)Open via inline link (2)

Named

We will animate the size of a named collapsible whenever it's status changes. So don't change the visiblity of the collapsible container with CSS, but rather its children.

I can be hidden. Or not.

Group

We will only allow one collapsible of group to be open (and auto-close all others). This will behave like an accordion.

I am the content number ##(i}

I am the content number ##(i}

I am the content number ##(i}

API

It is very simple to open/close a collapsible via custom JS. Just change the data-hidden attribute and we take care of the rest.

I can be hidden. Or not.

Collapsible Anchor Opener

Open via inline link

I can be hidden. Or not.

Collapsible Anchor Opener (2)

Open via inline link

I can be hidden. Or not.

Auto expanding collapsible

Open via inline link

Now there is more inside:

I am #open-3 (and I'm usually hidden)

I can be hidden. Or not.