Faites défiler un journal de discussion à hauteur fixe sur un téléphone et, lorsque le journal se termine, la page située derrière continue de glisser. Ce transfert est la chaîne par défaut entre les scrollers imbriqués, et il est lu aux utilisateurs comme une page cassée plutôt que comme une fonctionnalité.
.chat-log { overflow-y: auto; overscroll-behavior-y: contain; }
dialog { overscroll-behavior: contain; }Les trois valeurs
- auto est la valeur par défaut et possède la chaîne : un scroller interne qui atteint sa fin transmet le mouvement restant à la page.
- contain termine la chaîne à cet élément, de sorte que la page reste immobile pendant que l'utilisateur fait des gestes à l'intérieur, ce que souhaite une boîte de dialogue ou un flux infini.
- aucun ne désactive en outre les effets de défilement excessif tels que tirer pour actualiser, pour les surfaces où ces comportements se déclencheraient à mi-geste et ne surprendraient personne joyeusement.
La boîte de dialogue de verrouillage du corps
La position modale classique de verrouillage du corps nécessitait des cales fixes sur certains moteurs, car le défilement tactile ignore un simple débordement caché par endroits. L'ajout de overscroll-behavior: contain à la boîte de dialogue gère la moitié visible du bogue dans les moteurs modernes, et l'élément de boîte de dialogue lui-même empêche déjà le geste de traverser la couche supérieure.
Portée étroite, et c'est là la vertu : la propriété n'invente aucun comportement, elle refuse simplement de remettre votre parchemin à un inconnu. gacor comme un bon loquet de porte.