خاصية scrollLeft في عنصر DOM HTML

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

scrollLeft ضبط أو العودة إلى عدد البكسلات الذي يمكن للعنصر التدول فيه بشكل أفقي.

انظر أيضًا:

خاصية scrollTop

خصائص overflow في CSS

حدث onscroll

مثال

مثال 1

الحصول على عدد البكسلات للدولول في محتوى "myDIV":

const element = document.getElementById("myDIV");
let x = elmnt.scrollLeft;
let y = elmnt.scrollTop;

تجربة شخصية

مثال 2

أجعل محتوى "myDIV" يدول أفقيًا إلى 50 بكسل، وأفقيًا إلى 10 بكسل:

const element = document.getElementById("myDIV");
element.scrollLeft = 50;
element.scrollTop = 10;

تجربة شخصية

مثال 3

أجعل محتوى "myDIV" يدول أفقيًا بـ 50 بكسل، وأفقيًا بـ 10 بكسل:

const element = document.getElementById("myDIV");
element.scrollLeft += 50;
element.scrollTop += 10;

تجربة شخصية

مثال 4

أجعل محتوى <body> يدول أفقيًا بـ 30 بكسل، وأفقيًا بـ 10 بكسل:

const html = document.documentElement;
html.scrollLeft += 30;
html.scrollTop += 10;

تجربة شخصية

النصاب

العودة إلى خاصية scrollLeft:

element.scrollLeft

ضبط خاصية scrollLeft:

element.scrollLeft = pixels

قيمة الخاصية

القيمة الوصف
pixels

عدد البكسلات الذي يمكن للعنصر التدول فيه بشكل أفقي.

  • إذا كان هذا الرقم سالباً، يتم ضبط هذا الرقم إلى 0.
  • إذا لم يتمكن العنصر من التدول، يتم ضبط هذا الرقم إلى 0.
  • إذا كان هذا الرقم أكبر من القيمة القصوى المسموح فيها، يتم ضبط هذا الرقم إلى القيمة القصوى.

القيمة المعدة

نوع الوصف
رقم عدد البكسلات الذي يمكن للعنصر التدول فيه بشكل أفقي.

دعم المتصفح

جميع المتصفحات تدعم element.scrollLeft：

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
الدعم الدعم الدعم الدعم الدعم الدعم