ประกาศ scrollLeft ของ HTML DOM Element

การกำหนดและการใช้งาน

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
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน