Expand/Collapse Examples

This page demonstrates two accessible patterns for expanding and collapsing content. The first uses the native HTML <details> element, which is the preferred method. The second uses ARIA attributes for cases where custom behavior is required.

Native HTML Pattern (Preferred)

This implementation uses the native <details> and <summary> elements. It works without JavaScript and provides built-in accessibility semantics.

Shipping Information

Standard shipping takes 3-5 business days. Expedited shipping options are available at checkout. We currently ship to all 50 states and select international destinations.

View full shipping policy

Return Policy

Items can be returned within 30 days of receipt. Products must be in original packaging and unused condition. A restocking fee may apply for open box electronics.

ARIA Pattern (Custom)

This implementation uses a <button> with aria-expanded and aria-controls. This pattern requires JavaScript to function but offers more control over animations and state management.