Expand/Collapse Widget Demo

Section 1 Content

This is the hidden content for the first expand/collapse widget. It can contain any HTML elements like paragraphs, lists, images, or even forms. The smooth transition makes it feel modern and user-friendly.

  • Item 1
  • Item 2
  • Item 3

Section 2 Content

This second example shows that multiple widgets can be used independently. Each one maintains its own state, so expanding one doesn't affect the others.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Section 3 Content

This section starts expanded by default. You can customize the initial state by adding the 'expanded' class to the details div.

Placeholder image