Aether JS AetherJS

data-aether-scroll-lock

Bu nitelik, bir pencere açıldığında arka plandaki sayfanın (body) kaydırılmasını engeller. Kullanıcının odağını açık olan pencerede tutmak ve istenmeyen kaydırma zinciri sorununu önlemek için kullanılır.


01 Kullanım

Bu bir "Varlık Niteliği"dir (Boolean). Hedef elemente bu niteliği eklediğinizde, element açıldığı an body kaydırması durdurulur.

 
 
 
index.html
<div 
    id="demo-modal"
    class="hidden fixed inset-0 z-50 flex items-center justify-center"
    data-aether-click-outside
    data-aether-scroll-lock
>
    ...
</div>

02 Teknik Notlar

CSS Sınıfı

Bu özellik aktif olduğunda, sistem body etiketine konfigürasyonda belirtilen sınıfı (Varsayılan: overflow-hidden) ekler.

Eğer Tailwind CSS kullanıyorsanız bu sınıf zaten mevcuttur. Bootstrap veya özel CSS kullanıyorsanız, bu sınıfın CSS dosyanızda tanımlı olduğundan veya AetherUI config ayarlarından değiştirdiğinizden emin olun.