Aşırı kaydırma davranışı - CSS Hileleri

CSS'deki overscroll-behaviorözellik, bir öğenin "kaydırma zinciri" kullanıp kullanmayacağını kontrol eder. Muhtemelen bu davranışı daha önce yaşamışsınızdır ve belki de kaydırmanın web'de bu şekilde çalıştığını kabul etmişsinizdir! Kendi kaydırması olan bir öğenin içindeyseniz (dikey olduğunu söyleyin) ve alt kısmına kaydırdıysanız, varsayılan olarak bir sonraki üst öğe (belki sayfanın kendisi) bu yönde kaymaya başlar. Bu varsayılanı istemiyorsanız, overscroll-behavioronu kontrol eden şeydir.

.stop-scroll-chaining ( overscroll-behavior: contain; /* or "none" */ )

CodePen'de Chris Coyier (@chriscoyier) tarafından Kalem aşırı kaydırma davranışına
bakın.

Özellik basamaklanır (yani, miras alınır), bu nedenle, herhangi bir öğenin yapmasını sevmiyorsanız, herhangi bir yerde olmasını önlemek için vücuda uygulayabilirsiniz:

body ( overscroll-behavior: contain; /* or "none" */ )

noneDeğeri durdurmak gerekiyordu overscroll affordance hangi en iyi tahmin aracı, bazı böylece tarayıcıların bu lastik bantlama şeyler, dokunmatik kaydırma özellikle cihazlar gibi şeyler.

Varsayılan değer auto.

Kaynaklar

CSS Overscroll Davranışı Modülü Seviye 1
Web Platformu Haberleri

Tarayıcı Desteği

Bu tarayıcı destek verileri, daha fazla ayrıntıya sahip olan Caniuse'den alınmıştır. Bir sayı, tarayıcının özelliği o sürümde ve sonrasında desteklediğini gösterir.

Masaüstü Bilgisayar

Krom	Firefox	IE	Kenar	Safari
65	59	11	79	Hayır

Mobil / Tablet

Android Chrome	Android Firefox	Android	iOS Safari
88	85	81	Hayır

zemin filtresi
arka yüz görünürlüğü
arka fon
arka plan eki
arkaplan karışım modu
arka plan klibi
arka plan rengi
arka plan görüntüsü
arkaplan kökenli
arka plan konumu
arkaplan tekrar
arkaplan boyutu
kanamak
blok taşması
sınır
sınır sınırı
border-collapse
border-image
border-radius
border-spacing
alt
kutu dekorasyon molası
kutu gölgesi
kutu boyutlandırma
hırsızlık

başlık tarafı
şapka
şapka rengi
şapka şekli
açık
klip yolu
renk
renk ayarı
sütun sayısı
sütun dolgusu
sütun aralığı
sütun kuralı
sütun-kural-rengi
sütun-kural-stili
sütun-kural-genişliği
sütun aralığı
sütun genişliği
sütunlar
içeren
içerik
karşı artış
karşı sıfırlama
karşı set
imleç

yön
Görüntüle

boş hücreler

doldurmak
filtre
esnek
esnek tabanlı
esnek yön
esnek akış
esnek büyüme
esnek küçültmek
esnek sarma
yüzer
yazı tipi
yazı tipi görüntüleme
font ailesi
yazı tipi özellik ayarları
yazı tipi karakter aralığı
yazı tipi optik boyutlandırma
yazı Boyutu
yazı tipi boyutunu ayarlama
yazı tipi uzatma
yazı stili
yazı tipi sentezi
yazı tipi değişkeni
font-variant-numeric
yazı tipi ağırlığı

boşluk
ızgara satırı / ızgara sütunu
ızgara-şablon-sütunları / ızgara-şablon-satırları

asılı noktalama
yükseklik
tire

ben

görüntü oluşturma
ilk mektup
satır içi boyut
ek
iç blok
ek blok sonu
inset-block-start
satır içi
iç satır içi uç
inset-inline-start
izolasyon

haklı içerik
haklı-öğeler

ayrıldı
harf boşluğu
satır sonu
hat kıskacı
satır yüksekliği
liste biçimi

marj
marj bloğu
margin-block-end
margin-block-start
satır içi
margin-inline-end
margin-inline-start
maske klipsi
maske görüntüsü
maske modu
maske kökenli
maske pozisyonu
maske tekrar
maske boyutu
maksimum yükseklik
maks. satır içi boyut
maksimum genişlik
min-yükseklik
min-genişlik
mix-blend-mode

nesne uyumu
nesne konumu
ofset çapa
ofset mesafesi
öteleme yolu
ofset döndürmek
opaklık
sipariş
kimsesiz çocuklar
anahat
dış hat uzaklığı
taşma
taşma çapa
taşma sargısı
fazla kaydırma davranışı

dolgu malzemesi
sayfa sonu
boya siparişi
perspektif
perspektif kökenli
yer eşyaları
işaretçi olayları
durum

alıntılar

yeniden boyutlandır
sağ
satır aralığı

kaydırma davranışı
kaydırma kenar boşluğu
kaydırma dolgusu
kaydırma-hizalama
hızlı kaydırma
kaydırma tipi
kaydırma çubuğu
kaydırma çubuğu rengi
kaydırma çubuğu oluğu
kaydırma çubuğu genişliği
şekil-görüntü eşiği
şekil-kenar boşluğu
şekil dışı
konuşmak
inme
inme-çizgi dizisi
inme-çizgi ofseti
vuruş çizgisi
inme-linejoin
Darbe genişliği

sekme boyutu
masa düzeni
Metin hizalama
metin-son-hizala
dik metin birleştirme
metin süsleme
metin-dekorasyon-rengi
metin-dekorasyon-satırı
metin-dekorasyon-atlama
metin-dekorasyon-atlama-mürekkebi
metin dekorasyon stili
metin dekorasyon kalınlığı
metin girintisi
metin yaslama
metin yönü
metin taşması
metin oluşturma
Metin gölgesi
metin konturu
metin dönüşümü
metin altı çizgi uzaklığı
text-underline-position
üst / alt / sol / sağ
dokunma eylemi
dönüştürmek
dönüşüm kaynağı
dönüştürme stili
geçiş
geçiş gecikmesi
geçiş süresi
geçiş özelliği
geçiş zamanlama işlevi

unicode-bidi
unicode aralığı
kullanıcı seçimi

dikey hizala
görünürlük

Beyaz boşluk
dullar
Genişlik
değişecek
kelime arası
kelime aralığı
yazma modu

z-endeksi
yakınlaştır

Seçiciler

Bir
- ::önce sonra
- :aktif
- : herhangi bir bağlantı
- Bitişik kardeş
- (öznitelik)
B
- :boş
C
- :kontrol
- : akım
- Çocuk
- Sınıf
D
- :varsayılan
- : dir ()
- : devre dışı
- Azalan
E
- :boş
- : etkin
F
- ::ilk harf
- ::İlk satır
- :ilk çocuk
- : ilk-tip
- : odak
- : odak görülebilir
- : odak içinde
- : gelecek
G
- Genel kardeş
H
- : fareyle üzerine gelme
ben
- : aralık içi
- : belirsiz
- :geçersiz
- :dır-dir()
- İD
J
K
L
- : lang ()
- : son-çocuk
- : türünün sonu
- : bağlantı
M
- ::işaretleyici
- :maçlar()
N
- :değil()
- : nth-çocuk
- : nth-last-child
- : türün sonuncu n'si
- : nth-of-type
Ö
- : only-çocuk
- : tek-tip
- :isteğe bağlı
- : aralık dışı
P
- ::Yer tutucu
- : geçmiş
- : yer tutucu gösteriliyor
Q
R
- : okuma-yazma /: salt okunur
- :gereklidir
- :kök
S
- :: seçim
T
- :hedef
- Tür
U
- : kullanıcı geçersiz
- Evrensel
V
- :geçerli
- :ziyaret
W
X
Y
Z

Öğrenme Ortağımız

Ön Uç Ustaları

Ön uç geliştirme eğitimine mi ihtiyacınız var?

Frontend Masters, onu elde etmek için en iyi yerdir. React'ten CSS'ye, Vue'dan D3'e ve daha fazlası Node.js ve Full Stack ile en önemli ön uç teknolojileriyle ilgili kursları var.