MenusLesson 4Preview gratis
Accordion
Lesson ini bagian dari How To · Semua level
Ringkasan
Pelajaran ini mengulas pembuatan komponen Accordion (panel lipat buka-tutup) menggunakan HTML, CSS, dan JavaScript. Accordion sangat efektif untuk menghemat ruang layar pada halaman daftar FAQ atau dokumentasi bertingkat dengan menampilkan konten teks hanya saat judul panel diklik.
Poin kunci
- Accordion menyembunyikan konten secara default (display: none atau maxHeight: 0)
- Event listener click ditambahkan pada setiap tombol accordion untuk toggle visibilitas panel
- Mendukung animasi geser mulus (smooth slide) menggunakan properti max-height dan scrollHeight
- Menyediakan indikator visual seperti tanda plus (+) dan minus (-) untuk status buka-tutup
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.