CSS overscroll-behavior-x کا اپریشن
- پچھلے صفحے overscroll-behavior-inline
- آئندہ صفحہ overscroll-behavior-y
تعریف و استفاده
overscroll-behavior-x این ویژگی برای بستن زنجیرهی روانسازی یا بازخورد روانسازی در حالی که سعی میکنید فراتر از مرزهای روانسازی در محور x بچرخید، استفاده میشود.
توجه:برای فعالسازی overscroll-behavior در محور x، ممکن است نیاز به استفاده از حرکت دستی بر روی صفحهنمایش لمسی یا صفحهنمایش لمسی داشته باشید.
زنجیرهی روانسازیبه این معناست که روانسازی بیش از حد در یک عنصر منجر به رفتار روانسازی پدر میشود. این رفتار پیشفرض است.
روانسازی بیش از حدبازخورد، هنگامی که کاربر سعی میکند فراتر از مرزهای روانسازی بچرخد، داده میشود. به عنوان مثال، در دستگاههای موبایل، هنگامی که سعی میکنید فراتر از بالای صفحه بچرخید، معمولاً با بازخورد بصری بهروزرسانی صفحه همراه است.
مثال
باز کردن زنجیرهی روانسازی عنصر <div> قابل روانسازی در محور x:
#yellowDiv {
overscroll-behavior-x: contain;
}
جملهبندی CSS
overscroll-behavior-x: auto|contain|none|initial|inherit;
مقدار ویژگی
| مقدار | توضیح |
|---|---|
| auto | اجازه میدهد به زنجیرهای روانسازی و بازخورد روانسازی داده شود. مقدار پیشفرض. |
| contain | اجازه میدهد به بازخورد روانسازی داده شود، اما اجازه نمیدهد به زنجیرهای روانسازی داده شود. |
| none | اجازه نمیدهد به بازخورد روانسازی یا رفتار زنجیرهای روانسازی داده شود. |
| initial | این ویژگی را به مقدار پیشفرض خود تنظیم کنید. ببینید: initial. |
| inherit | این ویژگی را از عنصر پدر خود ارث میبرد. ببینید: inherit. |
جزئیات فنی
| مقدار پیشفرض: | auto |
|---|---|
| وراثت: | خیر |
| انیمیشن: | پشتیبانی نمیشود. لطفاً به:ویژگیهای مرتبط با انیمیشن. |
| نسخه: | CSS3 |
| جملهبندی JavaScript: | object.style.overscrollBehaviorX="none" |
پشتیبانی مرورگر
اعداد در جدول نشاندهنده نسخه اولین مرورگرهایی است که این ویژگی را کامل پشتیبانی میکنند.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 63.0 | 18.0 * | 59.0 | 16.0 | 50.0 |
* در Microsoft Edge، مقدار属性 none به contain تبدیل میشود که این نادرست است.
صفحات مرتبطه
مشارکت:CSS overscroll-behavior کا اپریشن
مشارکت:CSS overscroll-behavior-block کا اپریشن
مشارکت:CSS overscroll-behavior-inline کا اپریشن
مشارکت:CSS overscroll-behavior-y کا اپریشن
مشارکت:CSS scroll-behavior کا اپریشن
مشارکت:CSS scroll-margin کا اپریشن
مشارکت:CSS scroll-padding کا اپریشن
- پچھلے صفحے overscroll-behavior-inline
- آئندہ صفحہ overscroll-behavior-y
