خصائص overscroll-behavior-block CSS

التعريف والاستخدام

overscroll-behavior-block الخصائص تستخدم لتحديد إغلاق سلسلة التمرير (scroll chaining) أو ردود الفعل الزائدة (overscroll affordance) على العنصر عند محاولة التمرير في اتجاه الحزمة خارج حدود التمرير.

السلسلة التمريرية هي السلوك الذي يحدث عندما يتم تمرير الزائد في عنصر، مما يؤدي إلى سلوك التمرير في العنصر الأب. هذا هو السلوك الافتراضي.

الر反馈 الزائد هو الرجوع الذي يقدمه المتصفح عندما يحاول المستخدم تمرير خارج حدود التمرير. على سبيل المثال، عند محاولة تمرير خارج أعلى الصفحة على الهاتف المحمول، عادةً ما يكون هناك رجوع بصري مع تحديث الصفحة.

CSS overscroll-behavior-block و overscroll-behavior-inline الخصائص تتعامل مع overscroll-behavior-x و overscroll-behavior-y خصائص تشبه بعضها البعض، ولكن overscroll-behavior-block و overscroll-behavior-inline يعتمد الخاصية على اتجاه القطعة واتجاه الخط.

ملاحظة:خصائص CSS ذات الصلة writing-mode يحدد اتجاه القطعة. هذا يؤثر على اتجاه القطعة إذا كان في اتجاه x أو y، وكذلك overscroll-behavior-block نتيجة الخاصية. للصفحات باللغة الإنجليزية، اتجاه القطعة هو نحو الأسفل، واتجاه الخط هو من اليسار إلى اليمين.

مثال

مثال 1

إغلاق سلسلة التمرير في عناصر <div> القابلة للتمرير في اتجاه القطعة:

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

جرب بنفسك

مثال 2: دمج خاصية writing-mode

ضع خاصية <div> المكونة من writing-mode عندما يتم تعيين قيمة الخاصية 'vertical-rl'، يتحول اتجاه القطعة إلى x، لذا overscroll-behavior-block الآن يعمل في اتجاه x بدلاً من y:

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

جرب بنفسك

جملة CSS

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

قيمة الخاصية

تفاصيل التقنية

دعم المتصفح

الرقم في الجدول يمثل إصدار المتصفح الذي يدعم هذه الخاصية بشكل كامل.

الصفحات ذات الصلة

المرجع:خصائص overscroll-behavior CSS

المرجع:خصائص overscroll-behavior-inline CSS

المرجع:خصائص overscroll-behavior-x CSS

المرجع:خصائص overscroll-behavior-y CSS

المرجع:خصائص scroll-behavior CSS

المرجع:خصائص scroll-margin CSS

المرجع:خصائص scroll-padding في CSS

المرجع:خصائص scroll-snap-align في CSS

المرجع:خصائص writing-mode في CSS