Freecode
>  Home   HTML   CSS   JavaScript   PHP   Perl   Photoshop   TCP/IP 

วิธีทำให้หน้าต่างสั่นสะเทือน

          หึหึ ตอนเปิดเข้าหน้านี้คงจะตกใจล่ะสิ นี่แหละครับการทำให้หน้าต่างสั่นสะเทือน เหมาะอย่างยิ่งที่จะ ใส่ในหน้าแรกเพื่อให้ผู้ที่แวะเวียนมาเกิดความประทับใจ ถ้ามื่อกี้ดูไม่ทัน กดปุ่มข้างล่างนี้ดูใหม่ก็ได้นะครับ

:: How to Build ::
  1. ใช้ window.moveBy ย้ายตำแหน่งของ window
    window.moveBy(x,y) หมายถึง ย้ายไปทางขวา x pixel ย้ายลงข้างล่าง y pixel window.moveBy(10,10);
  2. ทำเป็น loop เพื่อให้เกิดการสั่นสะเทือน for (i=30;i>=10;i--) { window.moveBy(10,10); window.moveBy(-10,0); window.moveBy(0,-10); }
  3. ช่วงแรก (for loop ที่ 1) ย้ายทีละ 10 pixel
  4. ช่วงสุดท้าย ย้ายทีละ i โดย i เป็นตัวแปรที่มีค่าลดลงเรื่อยๆตาม loop for ทั้งนี้เพื่อให้ เห็นว่าการสั่นสะเทือนค่อยๆหยุด
  5. ใน <Body... ให้ใส่ onload="earthquake()" เพื่อเรียกฟังก์ชั่นขึ้นมาทำงาน

Full Coding

<html> <head> <title>Earth Quake</title> <script language="JavaScript"> function earthquake() { for (i=30;i>=10;i--) { window.moveBy(10,10); window.moveBy(-10,0); window.moveBy(0,-10); } for (i=10;i>=1;i--) { window.moveBy(i,i); window.moveBy(-i,0); window.moveBy(0,-i); } } </script> <body onload="earthquake()"> มีคำอธิบายใน Source Code ครับ </body> </head> </html>



© copyright 2001 Sorrawut Korsuwansiri