CSS overscroll-behavior ominaisuus

Määrittely ja käyttö

Esimerkki 2: Kaksivaiheinen syntaksi: Atribuutti käytetään estämään elementin rullausketju (scroll chaining) tai liikkeen ylitysvaroitus (overscroll affordance) yritettäessä liikkua yli rullausrajan.

Rullausketju: Kun yritetään liikkua yli elementin rullausrajan, se voi aiheuttaa vanhemman elementin rullauskäytöksen. Tämä on oletusarvoinen käyttäytyminen.

Liikkeen ylitysvaroitus: Vastaus, joka tarjotaan käyttäjälle, kun yritetään liikkua liian pitkälle liikkuvassa alueessa. Esimerkiksi, kun yritetään liikkua yli sivun ylälaidan puita puhelimessa, yleensä näkyy visuaalinen varoitus ja sivu päivitetään.

Esimerkki 2: Kaksivaiheinen syntaksi: 属性是以下属性的简写形式：

Esimerkki 2: Kaksivaiheinen syntaksi: overscroll-behavior-x

overscroll-behavior-y

Ominaisuuden arvo voidaan asettaa eri tavoin:
  • Jos overscroll-behavior-ominaisuudella on kaksi arvoa:
  • overscroll-behavior: none contain;

x-akseli: ei yliliikkeen toimintaa

Sulje liukukkeena olevan <div>-elementin liikkumisketju:
  • y-akseli: ei liikkumisketjua, mutta sallii yliliikkeen palautteen

Jos overscroll-behavior-ominaisuudella on yksi arvo:

x- ja y-akselit: ei liikkumisketjua, mutta sallii yliliikkeen palautteen

Esimerkki

Esimerkki 1
  Sulje liukukkeena olevan <div>-elementin liikkumisketju:
overscroll-behavior: auto none;

}

#yellowDiv {

overscroll-behavior: contain; Esimerkki 2: Kaksivaiheinen syntaksi: overscroll-behavior Asetetaan ominaisuuden arvoksiauto none

，sallii x-akselin liikkumisketjun ja yliliikkeen palautteen, mutta ei y-akselia:
  #pinkDiv {
overscroll-behavior: auto none;

}

Kokeile itse

CSS syntaksi

overscroll-behavior: auto|contain|none|initial|inherit;

Ominaisuuden arvo Arvo
Oletusarvo: Kuvaus
Sallii liikkumisketjun ja yliliikkeen palautteen. Oletusarvo. contain
Sallii yliliikkeen palautteen, mutta ei liikkumisketjua. none
Aseta tämä ominaisuus sen oletusarvon arvoon. Näe: Ei sallita yliliikkeen palautetta tai liikkumisketjua. Aseta tämä ominaisuus sen oletusarvon arvoon. Näe:Animaatiot
Näe: initial Näe:Animaatiot

inherit

Tekninen yksityiskohta Oletusarvo:
auto Perinnäisyys:
Ei Animaatioiden luominen:Ei tuettu. Katso:Animaatiot
. Versio:
CSS3 JavaScript syntaksi: object.style.overscrollBehavior="none"

Selaimen tuki

Taulukossa olevat luvut ilmaisevat ensimmäisen selaimen version, joka tukee kyseistä ominaisuutta.

Chrome Edge Firefox Safari Opera
63.0 18.0 * 59.0 16.0 50.0

* Microsoft Edge -ohjelmistossa arvo 'none' käsitellään kuin 'contain', mikä ei ole oikein.

Liittyvät sivut

Viittaus:CSS overscroll-behavior-x ominaisuus

Viittaus:CSS overscroll-behavior-y ominaisuus

Viittaus:CSS scroll-behavior ominaisuus

Viittaus:CSS scroll-margin ominaisuus

Viittaus:CSS scroll-padding -ominaisuus

Viittaus:CSS scroll-snap-align -ominaisuus