Devdit
 

JavaScript เลือนไปด้านบนสุด ด้วย window.scrollTo

1.3K

JavaScript เลือนไปด้านบนสุด ด้วย window.scrollTo บทความนี้สอนใช้คำสั่ง scrollTo ของ JavaScript เพื่อเลือน scroll หรือเนื้อหาไปด้านบนสุดของเว็บไซต์ ตัวอย่างสอนใช้คำสั่ง scrollTo สามารถเขียนโปรแกรมได้ดังนี้

 

ตัวอย่าง JavaScript เลือนไปด้านบนสุด ด้วย window.scrollTo

<pre>
<?php
    for( $i=0; $i<=1000; $i++ ) {
        echo $i."<br/>";
    }
?>
</pre>
<input type="button" style="position: fixed; bottom: 5px; right: 5px;" value="เลือนไปด้านบนสุด" onclick="scrollToTop()">
<script>
    function scrollToTop() {
        window.scrollTo(0, 0);
    }
</script>

คำอธิบาย

JavaScript เลือนไปด้านบนสุด จากตัวอย่างใช้ภาษา PHP วนลูปแสดงตัวเลข 1 ถึง 1000 เพื่อแสดงเนื้อหาที่ยาว พร้อมกับสร้างปุ่ม input button ไว้ที่ตำแหน่งด้านขวาล่าง เมื่อผู้ใช้งานกดปุ่ม จะเรียกใช้ฟังก์ชัน scrollToTop เพื่อเลือนไปด้านบนสุด ด้วยคำสั่ง window.scrollTo(0, 0) ของภาษา JavaScript

แก้ไข 1 ปีที่แล้ว
ชอบ
ลิ้งก์
แชร์
Devdit มีช่อง YouTube แล้ว
เราสร้างวิดีโอเกี่ยวกับเทคโนโลยี ทำตามง่ายๆ