1
0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-09-01 05:21:43 +02:00

Add accordion projectc idea

This commit is contained in:
Kamran Ahmed
2024-09-04 00:29:38 +01:00
parent 05d414adf4
commit 6da9dfc771
2 changed files with 34 additions and 2 deletions

View File

@@ -0,0 +1,32 @@
---
title: 'Accordion'
description: 'Create an accordion component using HTML, CSS, and JavaScript.'
isNew: false
sort: 18
difficulty: 'beginner'
nature: 'JavaScript'
skills:
- 'HTML'
- 'CSS'
- 'JavaScript'
- 'DOM Manipulation'
seo:
title: 'Build an Accordion Component with JavaScript'
description: 'Learn how to create a responsive accordion component that allows users to toggle between different sections of content.'
keywords:
- 'accordion'
- 'javascript accordion'
- 'html and css'
roadmapIds:
- 'frontend'
---
You are required to create an accordion component that displays a list of questions or headings. When a user clicks on a question, its corresponding answer or content section will expand while collapsing any previously opened section. This allows only one section to be open at a time, keeping the UI clean and organized.
Given below is the mockup showing the accordion in its default and expanded states:
[![Accordion](https://assets.roadmap.sh/guest/accordion-rbvpo.png)](https://assets.roadmap.sh/guest/accordion-rbvpo.png)
This project will help you practice DOM manipulation, event handling, and implementing responsive design patterns using JavaScript.
---

View File

@@ -2,8 +2,8 @@
title: 'Custom Dropdown'
description: 'Create a custom dropdown using HTML, CSS, and JavaScript.'
isNew: false
sort: 18
difficulty: 'beginner'
sort: 19
difficulty: 'intermediate'
nature: 'JavaScript'
skills:
- 'HTML'