overscroll-behavior-y
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2022年9月.
overscroll-behavior-y は CSS のプロパティで、スクロール領域の垂直方向の境界に達したときのブラウザーの挙動を設定します。
全体的な説明は overscroll-behavior を参照してください。
構文
css
/* キーワード値 */ overscroll-behavior-y: auto; /* 既定値 */ overscroll-behavior-y: contain; overscroll-behavior-y: none; /* グローバル値 */ overscroll-behavior-y: inherit; overscroll-behavior-y: initial; overscroll-behavior-y: revert; overscroll-behavior-y: revert-layer; overscroll-behavior-y: unset; overscroll-behavior-y プロパティは、次の値の一覧から選択した一つのキーワードで指定します。
値
公式定義
| 初期値 | auto |
|---|---|
| 適用対象 | 非置換ブロックレベル要素と非置換インラインブロック要素 |
| 継承 | なし |
| 計算値 | 指定通り |
| アニメーションの種類 | 離散値 |
形式文法
overscroll-behavior-y =
contain |
none |
auto
例
背後にある要素の縦スクロールの抑止
css
.messages { height: 220px; overflow: auto; overscroll-behavior-y: contain; } 完全な例と説明については、 overscroll-behavior を参照してください。
仕様書
| Specification |
|---|
| CSS Overscroll Behavior Module Level 1 # overscroll-behavior-longhands-physical |