Các tiện ích để kiểm soát hành vi của trình duyệt khi cuộn đến giới hạn của vùng cuộn.
| Class | Styles |
|---|---|
overscroll-auto | overscroll-behavior: auto; |
overscroll-contain | overscroll-behavior: contain; |
overscroll-none | overscroll-behavior: none; |
overscroll-x-auto | overscroll-behavior-x: auto; |
overscroll-x-contain | overscroll-behavior-x: contain; |
overscroll-x-none | overscroll-behavior-x: none; |
overscroll-y-auto | overscroll-behavior-y: auto; |
overscroll-y-contain | overscroll-behavior-y: contain; |
overscroll-y-none | overscroll-behavior-y: none; |
Sử dụng tiện ích overscroll-contain để ngăn việc cuộn trong vùng mục tiêu kích hoạt cuộn trong phần tử cha, nhưng vẫn giữ hiệu ứng "nảy" (bounce) khi cuộn qua cuối container trên các hệ điều hành hỗ trợ nó:
Cuộn để xem hành vi
Well, let me tell you something, funny boy. Y'know that little stamp, the one that says "New York Public Library"? Well that may not mean anything to you, but that means a lot to me. One whole hell of a lot.
Sure, go ahead, laugh if you want to. I've seen your type before: Flashy, making the scene, flaunting convention. Yeah, I know what you're thinking. What's this guy making such a big stink about old library books? Well, let me give you a hint, junior.
Maybe we can live without libraries, people like you and me. Maybe. Sure, we're too old to change the world, but what about that kid, sitting down, opening a book, right now, in a branch at the local library and finding drawings of pee-pees and wee-wees on the Cat in the Hat and the Five Chinese Brothers? Doesn't HE deserve better?
<div class="overscroll-contain ...">Well, let me tell you something, ...</div>Sử dụng tiện ích overscroll-none để ngăn việc cuộn trong vùng mục tiêu kích hoạt cuộn trong phần tử cha, và cũng ngăn chặn hiệu ứng "nảy" khi cuộn qua cuối container:
Cuộn để xem hành vi
Well, let me tell you something, funny boy. Y'know that little stamp, the one that says "New York Public Library"? Well that may not mean anything to you, but that means a lot to me. One whole hell of a lot.
Sure, go ahead, laugh if you want to. I've seen your type before: Flashy, making the scene, flaunting convention. Yeah, I know what you're thinking. What's this guy making such a big stink about old library books? Well, let me give you a hint, junior.
Maybe we can live without libraries, people like you and me. Maybe. Sure, we're too old to change the world, but what about that kid, sitting down, opening a book, right now, in a branch at the local library and finding drawings of pee-pees and wee-wees on the Cat in the Hat and the Five Chinese Brothers? Doesn't HE deserve better?
<div class="overscroll-none ...">Well, let me tell you something, ...</div>Sử dụng tiện ích overscroll-auto để cho phép người dùng tiếp tục cuộn vùng cuộn cha khi họ chạm đến giới hạn của vùng cuộn chính:
Cuộn để xem hành vi
Well, let me tell you something, funny boy. Y'know that little stamp, the one that says "New York Public Library"? Well that may not mean anything to you, but that means a lot to me. One whole hell of a lot.
Sure, go ahead, laugh if you want to. I've seen your type before: Flashy, making the scene, flaunting convention. Yeah, I know what you're thinking. What's this guy making such a big stink about old library books? Well, let me give you a hint, junior.
Maybe we can live without libraries, people like you and me. Maybe. Sure, we're too old to change the world, but what about that kid, sitting down, opening a book, right now, in a branch at the local library and finding drawings of pee-pees and wee-wees on the Cat in the Hat and the Five Chinese Brothers? Doesn't HE deserve better?
<div class="overscroll-auto ...">Well, let me tell you something, ...</div>Prefix an overscroll-behavior utility with a breakpoint variant like md: to only apply the utility at medium screen sizes and above:
<div class="overscroll-auto md:overscroll-contain ..."> <!-- ... --></div>Learn more about using variants in the variants documentation.