MYDS Logo

    MYDS

    Beta

    Akordion

    Paparkan kandungan secara padat dan boleh dilipat, lazimnya digunakan untuk seksyen Soalan Lazim (FAQ).

    accordion-anatomy.pngaccordion-anatomy.png

    Elemen utama yang mendefinisikan struktur dan fungsi Akordion:

    1. Teks Tajuk: Tajuk utama atau label untuk seksyen akordion.
    2. Teks Badan: Kandungan yang ditunjuk atau disembunyikan dalam akordion.
    3. Ikon Chevron (Default): Ikon yang dipaparkan pada sudut 0 darjah, menandakan bahagian itu ditutup.
    4. Ikon Chevron Bawah (Dikembangkan): Ikon berputar kepada 180 darjah untuk menandakan bahagian tersebut dibuka.

    Keadaan

    accordion-variation.pngaccordion-variation.png

    Menentukan cara visual Akordion memberi tindak balas terhadap tingkah laku pengguna seperti hover, fokus, atau klik, memberi maklum balas dan meningkatkan kebolehgunaan.

    1. Kawasan Klik (Tajuk): Kawasan tajuk yang boleh diklik untuk mengembangkan atau menyembunyikan akordion bagi memaparkan kandungan.
    2. Keadaan Hover: Gariskan teks tajuk apabila tetikus berada di atasnya.
    3. Keadaan Tertutup (Default): Menyembunyikan teks badan (Kebolehlihatan: 0%).
    4. Keadaan Terbuka: Klik pada kawasan tajuk untuk membuka akordion dan memaparkan teks badan.

    Demo

    Video contoh di bawah menunjukkan interaksi dan fungsi yang diinginkan untuk komponen Akordion.

    Di halaman ini