การเลื่อน (สครอลล์) องค์ประกอบใน JavaScript
คุณสมบัติต่อไปนี้เก็บค่าที่แสดงว่าองค์ประกอบถูกเลื่อนไปมากน้อยเพียงใด:
console.log(elem.scrollTop); // จากด้านบน
console.log(elem.scrollLeft); // จากด้านซ้าย
ตัวอย่างต่อไปนี้สาธิตการทำงานของข้อมูลคุณสมบัติเหล่านี้ ลองเลื่อนองค์ประกอบและกดปุ่ม คุณจะเห็นปริมาณการเลื่อน:
กำหนดองค์ประกอบและปุ่ม จากการกดปุ่ม จงหาว่าองค์ประกอบถูกเลื่อนในแนวตั้งไปมากน้อยเพียงใด
กำหนดองค์ประกอบและปุ่ม จากการกดปุ่ม จงตรวจสอบว่าองค์ประกอบถูกเลื่อนในแนวตั้งหรือไม่
เลื่อนองค์ประกอบไปจนสุด กดปุ่ม เพื่อให้แสดงค่าปริมาณการเลื่อนทั้งหมด
รับค่า scrollHeight ขององค์ประกอบ
แล้วลบด้วยปริมาณการเลื่อนทั้งหมด
(จากโจทย์ก่อนหน้า) ผลลัพธ์ที่ได้คืออะไร?
และมีขนาดอะไรบ้าง?
นำ offsetHeight และปริมาณการเลื่อนทั้งหมดมาบวกกัน
แล้วลบผลรวมนั้นออกจากค่า scrollHeight
ผลลัพธ์เป็นตัวเลขอะไร?