การใช้ Javascript ตรวจสอบจอ เพื่อเลือกภาพเป็น Background วิธีตรวจสอบการ Set หน้าจอ ของเครื่องอื่นๆ เพื่อเลือกภาพมาทำ Background ให้เหมาะสม เคยนึกกันไหมครับ ว่าเวลาเราทำ Blog หรือ HTML อะไรก็ตาม แล้วต้องมีภาพ Background แต่ทีนี้เราจะรู้ได้ยังไงว่าเราจะต้องทำ Background ให้มีขนาดเท่าไหร่ เพราะแต่ละคนก็ตั้งค่าหน้าจอไม่เหมือนกัน มันควรจะเป็นอย่างนั้น .. แต่จะทำยังไงล่ะ .. ถ้าได้อย่างนี้ล่ะก็ Optimize ได้เยี่ยมเลย วิธีการไม่ยากครับ สร้างภาพ Background ขึ้นมาโดยมีขนาดดังนี้ 640 x 480 (ตอนนี้คงไม่มีใครใช้ขนาดนี้แล้วมั้ง แต่ทำไว้เผื่อ) 800 x 600 อันนี้หลายคนก็ใช้อยู่ 1024 x 768 ส่วนมากก็จะเป็นอันนี้ 1280 x 1024 ใครจะใหญ่ๆ ก็เริ่มจะเป็นขนาดนี้แล้วครับ 1400 x 1050 ใหญ่มากเลยนะเนี่ย ใช้ Javascript เก็บชื่อไฟล์เหล่านี้เอาไว้ใน Array ใช้ Javascript ตรวจสอบการตั้งค่าจอภาพ เลือกภาพให้ได้ตามที่ตรวจสอบได้ แล้วกำหนดให้ภาพนั้นนำมาใช้เป็น Background ทั้งหมดนี้ ไม่ได้มีอะไรแปลกใหม่มากมาย เพียงแต่นำ Javascript เล็กๆ น้อยๆ มาประยุกต์เท่านั้นเองครับ ซึ่งใครศึกษามาบ้าง ก็คงไม่มีปัญหาอะไรเท่าไหร่ แต่ถ้าไม่เคยทำ หรือไม่ค่อยได้ใช้ ก็ค่อยๆ ทำความเข้าใจตามนะครับ การเก็บชื่อของไฟล์ภาพใน Array ทำดังนี้ครับ <script language=javascript> var myBackground=new Array(5) myBackground[0] = "//เว็บที่เก็บภาพ/bg640.jpg" myBackground[1] = "//เว็บที่เก็บภาพ/bg800.jpg" myBackground[2] = "//เว็บที่เก็บภาพ/bg1024.jpg" myBackground[3] = "//เว็บที่เก็บภาพ/bg1280.jpg" myBackground[4] = "//เว็บที่เก็บภาพ/bg1400.jpg" </script> การตรวจสอบหน้าจอ จริงๆ การตรวจสอบหน้าจอนี้ เราตรวจสอบแค่ขนาดของความกว้างก็ได้ครับ เพราะยังไง มันก็เป็นอัตราส่วน 4:3 กันอยู่แล้ว <script language=javascript> width = window.screen.width; switch (width){      case 640 : document.body.background = myBackground[0]; break;      case 800 : document.body.background = myBackground[1]; break;      case 1024 : document.body.background = myBackground[2]; break;      case 1280 : document.body.background = myBackground[3]; break;      case 1400 : document.body.background = myBackground[4]; break; } </script> แค่นี้ล่ะครับ วิธีจะทำให้ง่ายๆ ก็ทำใส่ไฟล์ .js เอาไว้ข้างนอก แล้วเรียกเอานะครับ เช่น <script language=javascript src="//เว็บของเรา/ไฟล์.js"></script> แล้วทีนี้ในไฟล์ .js ของเราก็ไม่ต้องมี <script..> เพื่อเปิด กับ </script> เพื่อปิดนะครับ เพราะมันจะ error แล้วในไฟล์ js นี้ สามารถขึ้นบรรทัดใหม่ได้ปกติครับ (ถ้าเราใส่ javascript ใน blog แล้วมีขึ้นบรรทัดใหม่ มันจะ error) ปล. แถมให้ครับ ว่าเครื่องของคุณมีการตั้งค่าหน้าจอเอาไว้ยังไงบ้าง หน้าจอของคุณตอนนี้ มีความกว้าง Pixel และมีความสูงของจอเป็น Pixel   Create Date : 20 มีนาคม 2548 41 comments Last Update : 20 มีนาคม 2548 21:33:23 น. Counter : 2341 Pageviews. Share Tweet

เฮ้ย มหัศจรรย์มากกกกกกกกก ขนาดไม่ได้อยู่ด้วยกัน ทำไมถึงรู้ได้ล่ะ ว่าเครื่องผม 1024 pixel โอ้คุณพระ   โดย: หมาร่าหมาหรอด 20 มีนาคม 2548 21:59:56 น.

ขอเวลางมก่อนนะคะ ขอบคุณมากค่ะ ...   โดย: ขอบคุณที่รักกัน (blueberry_cpie ) 20 มีนาคม 2548 22:19:08 น.

ทำไม่เปนค่ะ ทำไง... ปล.อ่านแล้วแต่งง..ว่าต้องใส่ตรงไหน   โดย: ngomngay 20 มีนาคม 2548 23:01:32 น.

ขอบคุณค่า...   โดย: prncess 20 มีนาคม 2548 23:13:44 น.

ของเด็กๆคับ JScript เหอๆ แต่ก็จุดประกายผมได้เยอะนะนี่   โดย: Shelling Ford` 20 มีนาคม 2548 23:29:25 น.

แหงบๆ ไอ้เขียนอะไม่ยากหรอกน้ากึ่ง แต่ว่าที่ยากน่ะ รูปหลังฉากง่ะ ครืออออ ขี้เกียจวาดหลายๆอันอะน้า คิคิคิ   โดย: เดาได้ป่าวว่าเราเป็นคราย (Sparty ) 21 มีนาคม 2548 5:29:06 น.

กึ่งยิงกึ่งผ่าน say : เวลาทำหลายๆ รูป ก็ทำทีเดียวดิครับ เริ่มทำจากรูปใหญ่ๆ ก่อน แล้วค่อยลดขนาดลงมาทีละ step แล้วค่อย save ให้เป็นขนาดที่ต้องการ อย่างนี้ความคมชัดก็ไม่เสียด้วยล่ะครับ   โดย: . IP: 61.91.87.70 21 มีนาคม 2548 8:30:25 น.

อืมๆ พอเข้าใจ concept ค่ะ แต่ว่า ไม่ทำดีกว่า ปวดกระโหลก ง่า ขอปวดกระโหลกเพราะฟังเพลงร็อคอย่างเดียวก็พอแล้ว คริคริ ><'   โดย: Together In 80s Dream 21 มีนาคม 2548 10:13:58 น.

อื่ม.. ได้ไอเดียร์แระ วิธีไม่ยากแต่ลืมคิด ขอบคุงมาก   โดย: นัท IP: 61.90.114.164 21 มีนาคม 2548 22:55:21 น.

ขอบคุณที่เขียนให้อ่านค่ะ แต่ตอนนี้คงไม่ต้องทำละ เพราะว่าเวปที่ทำมันใช้ bg แบบ repeat ยังไงก็ไม่เกี่ยวอยู่แล้วนิ   โดย: รำเพย 22 มีนาคม 2548 6:54:04 น.

ขอบคุณพี่กึ่งฯครับ ได้ความรู้อีกแล้ว ..ว่าแต่พี่ไม่เปลี่ยนเจ้าbackgoundบ้างล่ะครับ   โดย: MooG.G 22 มีนาคม 2548 11:12:05 น.

กึ่งยิงกึ่งผ่าน say : ช่วงนี้ยังไม่ค่อยว่างเลยครับ อยากจะเปลี่ยน bg ของตัวเองอยู่เหมือนกันครับ จริงๆ อยากทำ theme ประกวดเลยด้วยซ้ำ แต่ไม่ทัน ไม่มีเวลาเลย งานเยอะมั่ก เดี๋ยวอีกคงไม่นาน จะได้ปรับหน้าตา blog ใหม่อ่ะครับ รอว่างๆ อีกแป้บก่อนนะ อิอิ   โดย: กึ่งยิงกึ่งผ่าน 22 มีนาคม 2548 12:31:37 น.

เย้ ขอบคุณมากค่ะ น่ารักดีแฮะบล็อคนี้   โดย: แฟนไท (แฟนไท ) 23 มีนาคม 2548 11:44:16 น.

มาเยี่ยมพี่เวอร์ค่ะ....รอดูบล๊อกใหม่อยู่นะคะ   โดย: Mu_in_love (Mu_in_love ) 23 มีนาคม 2548 18:29:23 น.

..สวัสดีจ้า...น้องใหม่..มาขอคำแนะนำด้วยนะจ้า..แล้วก้ ขอ แอด ด้วยนะจ้า..ขอบคุณที่ให้เกล็ดความรู้นะจ้า..   โดย: จอมแก่นแสนซน 24 มีนาคม 2548 4:34:40 น.

มานั่งเรียนด้วยคนค๊า   โดย: น.ส.มารร้าย 24 มีนาคม 2548 7:22:34 น.

ขอบคุณฟามรู้เจ๋งๆฮ่ะพี่เวอร์   โดย: BloodHound 24 มีนาคม 2548 20:04:30 น.

มาแสดงความยินดีกับรางวัลดีเด่น BlogGang Popular Award สาขา Blog สรรสาระ [blog ไหน ที่คุณเข้าไปแล้ว ได้ความรู้เพียบ] และรางวัลดีเด่น BlogGang Popular Award สาขา Blogger ไอที [เจ้าของ blog ที่มักจะมีเทคนิคน่าสนใจ มาแนะนำการตกแต่ง blog ถูกใจคุณเสมอ]   โดย: Together In 80s Dream 25 มีนาคม 2548 19:44:10 น.

เข้ามาแสดงความยินดีกับรางวัลค่ะแอบมาดูเทคนิคบ่อยๆอิอิ ฉลองค่ะฉลอง   โดย: V-FAN 25 มีนาคม 2548 20:53:20 น.

อืมมม แล้วพวกที่ดูจากมือถือละคะ พวกนี้ขนาดหน้าจอแตกต่างหลากหลายมาก   โดย: นู๋เองง่ะ 26 มีนาคม 2548 0:54:12 น.

..แวะมา รายงานตัว จ้า..แล้วก็ ดีจัยกับ คนที่ชนะ ด้วยนะจ้า   โดย: จอมแก่นแสนซน 26 มีนาคม 2548 1:00:40 น.

เอารางวัลมาแจกคับ ดีใจด้วยฮับ   โดย: รำเพย 26 มีนาคม 2548 7:16:39 น.

หมั่นไส้คนดังฮะ   โดย: เคราเ IP: 61.90.121.147 26 มีนาคม 2548 10:50:52 น.

ยินดีด้วยกับรางวัลค่า แล้วก็ มาแอบอ่านอีกแล้ว ก็ได้ความรู้อีกแล้ว ถึงจะงงๆอยู่บ้าง แต่ก็ดีค่ะ   โดย: THE BEGINNING 27 มีนาคม 2548 1:57:30 น.

ยินดีด้วยค่ะ   โดย: หญ้าหนวดแมว 27 มีนาคม 2548 4:09:45 น.

แอบมาดูค่า   โดย: นมัสเต 27 มีนาคม 2548 11:02:50 น.

ขอบคุณคับ ทามได้ๆ อิอิ   โดย: nopu.th 27 มีนาคม 2548 11:49:30 น.

กึ่งยิงกึ่งผ่าน say : ขอบคุณทุกๆ คนมากเลยนะครับ อิอิ ดีใจๆๆๆ   โดย: .. IP: 61.91.87.190 27 มีนาคม 2548 13:02:56 น.

..ยังดีจัย แก้มบาน อยู่หรือเป่าจ้า..คุง กึ่งยิงกึ่งผ่าน..   โดย: จอมแก่นแสนซน 27 มีนาคม 2548 14:01:04 น.

comment# 14 ยินดีด้วยครับเฮีย เข้าชิง2 ได้ครบ 2 รางวัลเลย งวดหน้ามาแข่งรางวัลblogสวยกับเจ๊เพยกันดีกว่า สู้ว้อยยยย   โดย: หมาร่าหมาหรอด 27 มีนาคม 2548 16:15:15 น.

comment# 31 ขออภัย ใส่comment ผิด ต้อง31 อิอิ   โดย: หมาร่าหมาหรอด 27 มีนาคม 2548 16:16:43 น.

เหวยยยยยย อะไรกันสองลุงนี่ จะมาแข่งอะไรกับเพย เพยทำได้ที่ไหนกัน ถ้าไม่ได้สองลุงช่วยน่ะ บ๊อกเพยสงสัยล่มรายวัน ไม่เอาน่า ลูกศิษย์ได้รางวัล อาจารย์ทั้งสองน่าจะดีใจน้าาาาา   โดย: รำเพย 27 มีนาคม 2548 18:01:18 น.

sa wad dee kha   โดย: แม่มดน้อย23 28 มีนาคม 2548 8:46:47 น.

เข้ามาดู บล็อคได้รางวัล ^^ สาระเพียบบบบบ จริงๆ   โดย: เปลี่ยนชื่อไปเรื่อย 28 มีนาคม 2548 9:08:22 น.

ถ้าผมใช้เป็นแบบนี้เลยจะได้ไม๊อ่าครับ แบบไม่ต้องทำอาเรย์ อ่ะ switch (width){case 640 : document.body.background =" //www.เวปที่เราเก็บรูป.jpg"; break; .. .. }   โดย: หมาร่าหมาหรอด 2 เมษายน 2548 2:12:12 น.

เยี่ยมมากครับ และขอบคุณมากครับ   โดย: charan (Charan ) 2 เมษายน 2548 15:24:07 น.

ง่ะ สุดยอดเลย   โดย: Adct2Luv IP: 203.172.66.134 7 เมษายน 2548 10:49:21 น.

บอกได้คำเดียวว่า.......งง ไม่เข้าใจอ่ะ   โดย: APEC 4 พฤษภาคม 2548 16:17:55 น.

เข้าใจ concept ครับ แต่ว่า ไม่มีความสามารถด้าน js   โดย: dont wanna no 15 มิถุนายน 2548 23:35:00 น.

รบกวนถามครับ การใช้งานไฟล์ .js เวลาเขียนพาทในโฮมเพจเพื่อดึงมาใช้งาน นี่ เขียนเต็มเลยใช่ไหมครับ เคยเห็นบางเวบเขียน "/js/filename.js" เชาว่า / แทนรูท เลย ผมทำทั้งสองอย่างไม่ได้ง่ะ งงๆ รบกวนตอบให้ทีน่ะครับ ขอบคุงงับ icenasa@yahoo.com   โดย: ice IP: 124.120.143.97 7 มิถุนายน 2549 15:52:51 น.

แจ่มมากเลยครับ   โดย: nics_focus IP: 124.121.137.78 5 สิงหาคม 2551 0:40:05 น.