Expand/Collapse Widgets

Section 1: About This Widget

This is the first section of content. It demonstrates a simple expand/collapse functionality using basic HTML, CSS, and JavaScript.

Click the "Collapse" button above to hide this content again. This approach is useful for progressive disclosure, allowing users to see only what they need while keeping the interface clean.

Section 2: Features and Usage

Key Features:

How to Use:

Simply include the provided CSS for styling and the JavaScript for functionality. Wrap your button and collapsible content (within a div with class "details") inside an "example" div.

Each "details" div is initially hidden and toggles its display property on button click.

Section 3: Contact Information

For more information or support regarding this example, please contact us at:

Email: example@example.com

Phone: +1 (123) 456-7890

Address: 123 Demo Street, Webville, WD 12345