Atribut overscroll-behavior-block CSS

Halaman sebelumnya overscroll-behavior
Halaman berikutnya overscroll-behavior-inline

Definisi dan penggunaan

overscroll-behavior-block Properti untuk menonaktifkan scroll chaining atau kembalian penyelesaian berlebihan (overscroll affordance) pada elemen saat berusaha menggulir di luar batas pengguliran arah blok.

Garis guling adalah perilaku penarikan berlebihan di satu elemen yang menyebabkan perilaku penarikan di elemen orangtua. Ini adalah perilaku standar.

Umpan balik penarikan berlebihan adalah umpan balik yang diberikan saat pengguna mencoba mengeraskan di luar batas penarikan. Contohnya, di perangkat bergerak, saat mencoba mengeraskan di luar puncak halaman, biasanya disertai dengan umpan balik visual pembaruan halaman.

CSS overscroll-behavior-block dan overscroll-behavior-inline Properti sama seperti overscroll-behavior-x dan overscroll-behavior-y Properti sangat mirip, tetapi overscroll-behavior-block dan overscroll-behavior-inline Properti ini tergantung dari arah blok dan arah baris.

Perhatian:Properti CSS yang berhubungan writing-mode Mendefinisikan arah blok. Ini mempengaruhi apakah arah blok berada di arah x atau arah y, serta overscroll-behavior-block Hasil properti. Untuk halaman berbahasa Inggris, arah blok adalah ke bawah, arah baris adalah dari kiri ke kanan.

Contoh

Contoh 1

Tutup garis guling di elemen <div> yang dapat digerakkan di arah blok:

#yellowDiv {
  overscroll-behavior-block: contain;
}

Coba sendiri

Contoh 2: Gabungan properti writing-mode

Atur elemen <div> writing-mode Ketika properti nilai 'vertical-rl' disetel, arah blok berubah menjadi arah x, jadi overscroll-behavior-block Sekarang berfungsi di arah x, bukannya arah y:

#yellowDiv {
  writing-mode: vertical-rl;
  overscroll-behavior-block: contain;
}

Coba sendiri

Sintaksis CSS

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

Nilai properti

Nilai	Deskripsi
auto	Mengizinkan perilaku garis guling dan umpan balik penarikan berlebihan. Nilai standar.
contain	Mengizinkan umpan balik penarikan berlebihan tetapi tidak mengizinkan garis guling.
none	Tidak mengizinkan umpan balik penarikan berlebihan atau perilaku garis guling.
initial	Atur properti ini ke nilai standarnya. Lihat initial.
inherit	Mengambil properti ini dari elemen orangtua. Lihat inherit.

Detil teknis

Nilai standar:	auto
Inheritance:	Tidak
Pembuatan animasi:	Tidak didukung. Lihat:Properti berhubungan dengan animasi.
Versi:	CSS3
Sintaksis JavaScript:	object.style.overscrollBehaviorBlock="none"