Thuộc tính overscroll-behavior-x của CSS
- Trang trước overscroll-behavior-inline
- Trang tiếp theo overscroll-behavior-y
Định nghĩa và cách sử dụng
overscroll-behavior-x Thuộc tính này được sử dụng để tắt chuỗi cuộn hoặc phản hồi cuộn quá mức khi cố gắng cuộn ra ngoài biên giới cuộn trên hướng x.
Lưu ý:Để kích hoạt overscroll-behavior trên hướng x, bạn có thể cần sử dụng cử chỉ cuộn trên bảng cảm ứng hoặc màn hình chạm.
Chuỗi cuộnLà khi cuộn quá mức trên một phần tử sẽ gây ra hành vi cuộn của phần tử cha. Đây là hành vi mặc định.
Cuộn quá mứcPhản hồi là phản hồi được cung cấp khi người dùng cố gắng cuộn ra ngoài biên giới cuộn. Ví dụ, trên thiết bị di động, khi cố gắng cuộn ra ngoài phần trên của trang, thường đi kèm với phản hồi視 giác của việc trang được làm mới.
Ví dụ
Tắt chuỗi cuộn của phần tử <div> cuộn trên hướng x:
#yellowDiv {
overscroll-behavior-x: contain;
}
Ngữ pháp CSS
overscroll-behavior-x: auto|contain|none|initial|inherit;
Giá trị thuộc tính
| Giá trị | Mô tả |
|---|---|
| auto | Cho phép hành vi chuỗi cuộn và phản hồi cuộn quá mức. Giá trị mặc định. |
| contain | Cho phép hành vi phản hồi cuộn quá mức nhưng không cho phép chuỗi cuộn. |
| none | Không cho phép phản hồi cuộn quá mức hoặc hành vi chuỗi cuộn. |
| initial | Đặt thuộc tính này về giá trị mặc định. Xem thêm initial. |
| inherit | Kế thừa thuộc tính này từ phần tử cha. Xem thêm inherit. |
Chi tiết kỹ thuật
| Giá trị mặc định: | auto |
|---|---|
| Kế thừa: | Không |
| Chế tạo animation: | Không hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation. |
| Phiên bản: | CSS3 |
| Ngữ pháp JavaScript: | object.style.overscrollBehaviorX="none" |
Hỗ trợ trình duyệt
Số trong bảng biểu thị phiên bản trình duyệt đầu tiên hỗ trợ thuộc tính này hoàn toàn.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 63.0 | 18.0 * | 59.0 | 16.0 | 50.0 |
* Trong Microsoft Edge, giá trị thuộc tính none sẽ được coi là contain, điều này là không chính xác.
相关页面
Tham khảo:Thuộc tính overscroll-behavior của CSS
Tham khảo:Thuộc tính overscroll-behavior-block của CSS
Tham khảo:Thuộc tính overscroll-behavior-inline của CSS
Tham khảo:Thuộc tính overscroll-behavior-y của CSS
Tham khảo:Thuộc tính scroll-behavior của CSS
Tham khảo:Thuộc tính scroll-margin của CSS
Tham khảo:Thuộc tính scroll-padding của CSS
Tham khảo:Thuộc tính scroll-snap-align của CSS
- Trang trước overscroll-behavior-inline
- Trang tiếp theo overscroll-behavior-y
