Expand/Collapse Widgets

Widget 1: Basic Expand/Collapse
Click to expand ▼

This is the hidden content that appears when you click the header. You can include any HTML content here - text, images, forms, etc.

Widget 2: FAQ Section
What is this widget? ▼

This is an expand/collapse widget, also known as an accordion. It allows you to toggle the visibility of content by clicking the header. Multiple widgets can work independently or as part of an accordion group.

Widget 3: More Information
How does it work? ▼

The widget uses CSS transitions and JavaScript to smoothly expand and collapse the content. The toggle icon rotates 180 degrees when expanded, providing visual feedback to the user.

  • Click the header to toggle
  • Content smoothly slides in and out
  • Multiple widgets can be open at once
Widget 4: Features
Features of this widget ▼

Key Features:

  • Smooth CSS transitions
  • Simple JavaScript implementation
  • Responsive design
  • Easy to customize
  • Accessible keyboard support ready