Aether JS AetherJS

data-aether-target

Bu nitelik, etkileşimin nereye uygulanacağını belirler. Bir tetikleyici (trigger) ile yönetilmek istenen HTML elementi arasındaki köprüyü kurar.


01 Çalışma Mantığı

data-aether-target niteliği, standart HTML ID seçicileri ile çalışır. Tetikleyiciye verdiğiniz değer, yönetilecek olan elementin id niteliği ile birebir eşleşmelidir.

 
 
 
index.html
<!-- trigger -->
<button 
    data-aether-trigger="ui-control"
    data-aether-target="user-dropdown"
>
    ...
</button>

<!-- target -->
<div id="user-dropdown" class="hidden...">
    ...
</div>

02 Kullanım Alanları

Bu nitelik sadece tetikleyicilerde değil, bazı durumlarda gruplayıcı elementlerde de kullanılır.

Element Tipi Görevi
Trigger (Tetikleyici) Hangi elementin açılıp kapanacağını belirler. (En yaygın kullanım)
Tab Butonu Hangi sekme panelinin (Tab Panel) aktif olacağını belirler.
Accordion Header Hangi akordeon panelinin genişletileceğini belirler.