scroll-snap-stop
on osa CSS Scroll Snap moodulist. Kerimise klõpsamine viitab vaateakna asukoha lukustamisele lehe konkreetsetele elementidele, kui akent (või keritavat konteinerit) keritakse. Mõelge kerimisele klõpsatavale konteinerile, näiteks panete magneti elemendi otsa, mis jääb vaateakna ülaosale ja sunnib lehe sealsamas kerimise lõpetama.
scroll-snap-stop
on valikuline omadus kerimise klõpsamise elemendi jaoks kerimise klõpsamise konteineris. Lisateavet kerimisnuppude klõpsamise kohta leiate scroll-snap-type
almanahhikirjest.
scroll-snap-stop
võimaldab teil sundida kerimise klõpsutavat konteinerit kindlale elemendile klõpsama. Oletame, et kerisite kerimisnupu sees ja andsite sellele hiiglasliku hiireratta. Tavaliselt laseb brauser teie kerimise kiirusel lennata kinnituspunktidest, kuni see asetub sirvimispunkti lähedale sellele, kus kerimine tavaliselt lõpeb. Seadistuse scroll-snap-stop
abil saate brauserile öelda, et see peab enne konkreetset elementi peatuma, enne kui lubate kasutajal sellest mööduda.
/* Assuming this element is a child of a container with `scroll-snap-type` set */ .element ( scroll-snap-stop: always; )
Süntaks
scroll-snap-stop: normal | always;
Väärtused
scroll-snap-stop
aktsepteerib järgmisi väärtusi:
normal
on vaikeväärtus ja võimaldab elemendil mööda sirvida, ilma et see klõpsataksalways
sunnib brauserit selle elemendi külge haarama, isegi kui kerimine läheb tavaliselt sellest elemendist mööda
Näide
Vaadake
CodeSenil CSS-Tricksi (@ css-tricks) näite Pliiats kerimise- klõpsamise peatamise kohta.
Brauseri tugi
Need brauseri tugiandmed pärinevad Caniuse'ilt, millel on üksikasjalikum teave. Number näitab, et brauser toetab selle versiooni ja uuemat funktsiooni.
Töölaud
Chrome | Firefox | IE | Edge | Safari |
---|---|---|---|---|
69 | 68 | 11 * | 79 | 11 |
Mobiil / tahvelarvuti
Android Chrome | Android Firefox | Android | iOS-i Safari |
---|---|---|---|
88 | 85 | 81 | 11.0-11.2 |
Pange tähele, et Chrome ei pruugi praegu toetada scroll-snap-stop: always;
.
Seotud
scroll-snap-type
scroll-margin
scroll-padding
scroll-snap-align
Ressursid
- CSS Scroll Snap W3C kandidaatide soovitus
- Praktiline CSS-i kerimise napsutamine
- Tutvustame CSS-i kerimispunkte