data-aether-allow-multiple
Bu nitelik, Accordion gruplarının davranışını değiştirir. Varsayılan olarak bir panel açıldığında diğerleri kapanırken, bu özellik sayesinde kullanıcı birden fazla paneli aynı anda açık tutabilir.
01 Kullanım
Bu bir "Varlık Niteliği"dir (Boolean). Sadece accordion-group olarak tanımlanmış kapsayıcı elemente eklenir.
<!-- Wrapper --> <div data-aether-ui="accordion-group" data-aether-allow-multiple > <!-- Item 1 --> <div> <button data-aether-trigger="accordion" data-aether-target="brands"> Brands </button> <div id="brands" data-aether-ui="accordion-panel"> Nike, Adidas, Puma... </div> </div> <!-- Item 2 --> <div> <button data-aether-trigger="accordion" data-aether-target="sizes"> Sizes </button> <div id="sizes" data-aether-ui="accordion-panel"> S, M, L, XL... </div> </div> </div>
02 Davranış Karşılaştırması
Standart akordeon ile çoklu akordeon arasındaki farklar aşağıdaki gibidir.
| Mod | Davranış | Uygun Senaryo |
|---|---|---|
| Varsayılan | Bir panel açılınca diğer tüm paneller otomatik kapanır. Sadece 1 panel açık kalabilir. | SSS (FAQ) sayfaları, adım adım ilerleyen süreçler. |
| allow-multiple | Paneller birbirinden bağımsız çalışır. Kullanıcı hepsini açabilir veya hepsini kapatabilir. | E-ticaret filtreleri, Dashboard widgetları, Detaylı ayar menüleri. |
03 Kombinasyon İpucu
Default Open ile Birlikte Kullanım
allow-multiple özelliği, data-aether-default-open ile harika çalışır.
Örneğin filtre menüsünde "Markalar" ve "Fiyat Aralığı" sekmelerinin sayfa yüklendiğinde aynı anda açık gelmesini istiyorsanız, grup elementine allow-multiple, her iki butona da default-open vermeniz yeterlidir.