รู้จักกับ Inspector เครื่องมือช่วยคนทำเว็บ

Inspector (บางคนก็เรียก Debugger หรือ Developer Tools) เป็นเครื่องมือที่ช่วยให้เราสามารถดูและแก้ไข element ต่างๆ บนหน้าเว็บและดูผลลัพธ์ได้ทันที (แต่จะเป็นการแก้ไขชั่วคราว  รีเฟรชหน้าเว็บก็หาย  เหมาะกับการลองแก้เว็บ  ก่อนจะเอาไปลงไฟล์จริงๆ)  รวมทั้งใช้ตรวจสอบโค๊ดที่ผิดพลาดต่างๆ  การดูค่าของตัวแปรและวัตถุของจาวาสคริปท์   และยังมีฟีเจอร์อำนวยความสะดวกต่างๆ สำหรับคนทำเว็บอีกมากมาย

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

Inspector ในแต่ละเบราเซอร์

ปกติแล้วในแต่ละเบราเซอร์  ก็มักจะแถม Inspector ของตัวเองมาให้ใช้งานด้วยเช่นกัน (หรือถ้าเป็นเบราเซอร์ที่ใช้พื้นฐานมาจาก Chromium ก็จะแถม Developer tools ของ Chrome มาให้ใช้งาน)

Read More

$(document).ready กับ $(window).load จะใช้อะไรดี?

ใน jQuery มีวิธีสั่งให้สคริปท์ทำงานเมื่อหน้าเว็บโหลดเสร็จอยู่สองวิธี คือ

$(document).ready();

และ

$(window).load();

ซึ่งสองวิธีนี้มันมีจุดต่างกันเล็กน้อยครับ

$(document).ready();

สำหรับ $(document).ready(); นั้น จะเป็นการสั่งให้โค๊ดทำงานเมื่อเบราเซอร์โหลด HTML Document ทั้งเว็บเสร็จเรียบร้อย และ DOM อยู่ในสถานะพร้อมใช้งาน จึงจะสั่งให้ JavaScript ทำงานครับ (คือมันไม่รอให้อะไรอย่างอื่น เช่นไฟล์ภาพบนหน้าเว็บโหลดเสร็จ ก็จะสั่งให้สคริปท์ทำงานเลย)

วิธีนี้จะมีปัญหากับเบราเซอร์บางตัว ไม่สิ ตัวเดียวเลย ก็คือ Google Chrome ครับ อย่างล่าสุดที่ผมเจอนี่คือสคริปท์จะทำงานก่อนที่ CSS จะประมวลผลหมด

$(window).load();

เมื่อวิธีแรกมีปัญหา เราก็เปลี่ยนมาใช้วิธีนี้ครับ $(window).load(); จะเป็นการสั่งให้สคริปท์ทำงานเมื่อหน้าเว็บทั้งหน้าโหลดเสร็จเรียบร้อยครับ คือสคริปท์จะรอให้ทุกอย่างบนหน้าเว็บโหลดเสร็จเรียบร้อย ทั้งภาพ วัตถุ หรือเฟรมต่างๆ แล้วจึงค่อยให้สคริปท์ทำงานครับ

Read More

ปฏิบัติการ Exteen

เมื่อนานมาแล้ว สมัยที่ใช้โดเมน .co.cc ตอนนั้นผมเคยเขียนเรื่อง Redirect จาก Bloggang มาที่เว็บผมเอง มาวันนี้ก็ไปลองคุ้ยๆ Exteen ดู (ระบบภายในออกแบบมาคล้ายๆกับ WordPress ครับ) พบว่าเราก็สามารถใน JavaScript ลงไปในส่วนของ Widget “Custom Code” ได้เช่นเดียวกันกับที่เราใส่ JavaScript ไปที่ Head ของ Bloggang ซึ่ง Exteen ได้ให้เราไว้ 4 Widgets ด้วยกัน

เสร็จโจรสิครับ…

Read More

เมื่อ BlogGang ไม่เพียงพอต่อความต้องการ

ในตอนแรกก่อนที่ผมจะมาแปะ Blog ไว้บนโฮสต์ตัวเอง ผมได้ด้อมๆมองๆ Blog Community ใหญ่ๆเอาไว้ก่อนแล้ว ซึ่งผมมีอยู่ 3 ตัวเลือกในหัว คือ WordPress.com , Exteen.com และ Bloggang.com ซึ่ง WordPress.com เป็นที่ที่ผมตัดทิ้งไปที่แรก เพราะผมไม่สามารถสมัครด้วย Username ประจำ (mrwhisper) ของผมได้ เหตุเกิดเพราะชื่อมันโหล มีฝรั่งเอาไปใช้แล้วนั่นเอง

มาดูที่ Exteen ซึ่งเป็น Blog Provider ที่เป็นที่นิยมในหมู่วัยรุ่นคนไทยในปัจจุบัน (ผมคิดว่าน่าจะเป็นอันดับ 1 ด้วยซ้ำ) และใช้เอ็นจิ้นที่มีลักษณะคล้ายกับ WordPress (ซึ่งผมก็ไม่แน่ใจว่า Core จริงๆของ Exteen คืออะไร) และสามารถตกแต่งบล็อกได้ค่อนข้างอิสระ แต่ว่าึบล็อกของผมค่อนข้างเกี่ยวกับ Software ซึ่งใน Exteen ไม่ค่อยเป็นที่นิยมสักเท่าไหร่นัก Exteen เลยตกขอบไปอีกอัน (แต่ผมก็เปิดเอาไว้เขียนเรื่องไร้สาระ)

มาดูที่สุดท้าย คือ Bloggang ที่ถ้าดูที่กลุ่มผู้ใช้ ก็ค่อนข้างจะตรงกับความต้องการมากที่สุด แต่ปัญหามันอยู่ที่ตัวระบบของ Bloggang ครับ ที่ไม่ค่อยถูกใจผมสักเท่าไหร่ แต่ในแง่ของการ Customize แล้ว ก็ค่อนข้างจะทำได้สูงอยู่มากทีเดียว เนื่องจากผู้ใช้สามารถใส่สคริปท์ตกแต่งได้เองในแท็ก <head> และยังใส่พารามิเตอร์เพิ่มเติมให้กับแท็ก <body> ได้อีกด้วย ซึ่งงานนี้ก็ได้ใส่ JavaScript กันสนุกเลยครับ

Read More