Proprietatea overscroll-behavior controlează acțiunea executată de browser atunci când utilizatorul atinge capătul unei zone derulabile (scroll boundary). În mod implicit, când derulezi un meniu lateral sau o fereastră modală și ajungi la sfârșitul conținutului, browserul propagă acțiunea către pagina părinte din spate (un comportament deranjant numit Scroll Chaining).
Izolarea derulării într-o fereastră modală sau meniu lateral
/* 1. Meniu lateral / Fereastră modală izolată */
.modal-corp {
max-height: 400px;
overflow-y: auto;
/* Previne derularea paginii din spate când ajungi la capătul modalului */
overscroll-behavior: contain;
}
/* 2. Aplicație de tip PWA: Dezactivarea gestului pull-to-refresh pe mobil */
body {
/* Blochează reîncărcarea automată a paginii când tragi de sus în jos pe Chrome Android */
overscroll-behavior-y: none;
}
Valori Posibile
auto(implicit): Comportamentul standard — permite transmiterea mișcării către elementul părinte (scroll chaining) și afișează efectul de elastic/bounce pe macOS și iOS.contain: Blochează scroll chaining-ul. Când ajungi la capăt, derularea se oprește local, fără a mișca restul paginii. Efectul de bounce local rămâne activ.none: Blochează complet atât scroll chaining-ul, cât și efectul vizual de bounce de la marginea ecranului.
Întrebări & Exemple de Cod:
overscroll-behavior (Controlul Scroll-ului și Evitarea Bounce-ului)Ai o nelămurire despre utilizarea comenzii
overscroll-behavior (Controlul Scroll-ului și Evitarea Bounce-ului)sau ai descoperit un truc / fragment de cod util? Distribuie-l cu ceilalți programatori!Fii primul care pune o întrebare sau distribuie un fragment de cod / prompt!
Nu au fost adăugate încă întrebări sau exemple de cod pentru această pagină. Dacă ai întâlnit o problemă sau ai un snippet util, adaugă-l mai jos pentru a-i ajuta pe ceilalți.