CSS scroll-snap-stop eigenschap

Definitie en gebruik

Bij het snel schuiven op het touchpad of touchscreenscroll-snap-stop Deze eigenschap wordt gebruikt om aan te geven of de scroll direct over elementen heen gaat of stopt en zich aan het volgende element vastklikt.

Om het stopgedrag van het scrollen te controleren, moet je de eigenschap instellen op de onderliggende elementen. scroll-snap-stop en scroll-snap-align Eigenschap, en stel ook in op de ouderlijke elementen scroll-snap-type Eigenschap.

Opmerking: Je moet gebruik maken van het veeg手势 op een apparaat met touchpad of touchscreen om de eigenschap te ervaren. scroll-snap-stop EigenschapsEffecten.

Voorbeeld

Forceer bij het snel schuiven op het touchpad of touchscreen de scroll te stoppen en aan het volgende element te吸附, in plaats van direct over te slaan:

div {
  scroll-snap-stop: always;
}

Probeer het zelf

CSS Syntax

scroll-snap-stop: normal|always|initial|inherit;

Eigenschapswaarde

Waarde Beschrijving
normal Standaardwaarde. Na een snelle afdaling op het touchpad of touchscreen, vermindert de scroll geleidelijk en overslaat meerdere elementen.
always Na een snelle afdaling op het touchpad of touchscreen, stopt de scroll en wordt het volgende element aan de focuspositie ge吸附.
initial Stel deze eigenschap in op de standaardwaarde. Raadpleeg initial.
inherit Deze eigenschap overneemt van de ouderlijke elementen. Raadpleeg inherit.

Technische details

Standaardwaarde: normal
Inheritantie: Nee
Animatieproductie: Niet ondersteund. Raadpleeg:Animatiegerelateerde eigenschappen.
Versie: CSS3
JavaScript Syntax: object.style.scrollSnapStop="always"

Browserondersteuning

Tabelnummers geven de browserversie aan die de eigenschap volledig ondersteunt.

Chrome Edge Firefox Safari Opera
75.0 79.0 103.0 15.0 62.0

Gerelateerde pagina's

Referentie:CSS scroll-snap-align eigenschap

Referentie:CSS scroll-snap-type eigenschap