Friday, 21 September 2012

Load CSS and JavaScript at Runtime using "rloader"

สำหรับผู้ที่ต้องการ load CSS หรือ JavaScript ในขณะ Run Time ลองใช้งาน rloader ดูครับ เป็น jQuery Plugin ใช้งานง่าย เพียงแค่บรรทัดเดียว นอกจากนั้น rloader ยังช่วย tracking CSS หรือ JavaScript ที่เรา load ไปแล้ว ทำให้ไม่ load ซ้ำ ซึ่งจะเหมือนกับการใช้งาน require_once ใน PHP เทคนิคในการ load CSS หรือ JavaScript ในรูปแบบนี้ บางครั้งเราเรียกกันว่า Lazy Loading สำหรับผู้ที่สนใจ สามารถศึกษาการใช้งานได้ที่นี่ครับ http://code.google.com/p/rloader/

แหล่งที่มา: http://code.google.com/p/rloader/

Tuesday, 4 September 2012

CSS Table Display

การนำ CSS Table Display มาใช้ในการวาง layout จะช่วยให้เราสามารถจัดวาง Layout ได้เหมือนกับการใช้ Table แต่เป็นการใช้ CSS แทนที่จะใช้ Table Tag ซึ่งเราควรใช้ Table Tag สำหรับในกรณีที่ข้อมูลที่เรากำลังเสนอนั้นอยู่ในรูปแบบของ table สำหรับข้อดีอีกอย่างที่เห็นก็คือ การสร้าง Column ในแบบ Equal Height ซึ่งปกติจะเป็นเรื่องที่วุ่นวายพอสมควร แต่เราสามารถทำได้ง่ายๆโดยใช้ CSS Table สำหรับบทความแนะนำการใช้งานแบบสั้นๆ สามารถเข้าไปอ่านได้ที่นี่ครับ
  1. http://www.onenaught.com/posts/201/use-css-displaytable-for-layout
  2. http://ajaxian.com/archives/display-table 
ส่วนรายชื่อของ Web Browser ที่รองรับ CSS Table Display สามารถเข้าไปดูได้ที่นี่ครับ http://caniuse.com/css-table

แหล่งที่มา :

  1. http://www.onenaught.com/posts/201/use-css-displaytable-for-layout
  2. http://ajaxian.com/archives/display-table
  3. http://caniuse.com/css-table

Monday, 27 August 2012

JSColor JavaScript/HTML Color Picker

พอดีว่าผมกำลังพัฒนา Web Application ขึ้นมาตัวหนึ่ง และอยากจะให้ User สามารถกำหนดสีของ Background ได้เอง แต่ถ้าจะให้ User ป้อน HTML Color ในรูปแบบ Hex Code ก็คงจะดูไม่ดีซักเท่าไหร่ ก็เลยลองค้นใน Google ในที่สุดก็เจอ Library ตัวนึงมีชื่อว่า JSColor ซึ่งเป็น JavaScript สำหรับช่วยสร้าง Color Picker พัฒนาขึ้นโดย Jan Odvárko ดูแล้วน่าสนใจดีครับ สำหรับใครที่อยากจะลอง Download มาใช้งานก็เข้าไปที่นี่ครับ http://jscolor.com/

แหล่งที่มา : http://jscolor.com/

Quick CSS Trick: How To Center an Object Exactly In The Center

ปกติผมมักจะวาง DIV ให้อยู่ในตำแหน่ง center โดยใช้ margin: 0 auto แต่วิธีการนี้ ใช้ไม่ได้กับ DIV ที่มี position แบบ fixed ก็เลยลองค้นหาใน Google ดู ก็เจอบทความแนะนำวิธีการเอาไว้ ลองอ่านดูได้ที่นี่ครับ http://bit.ly/Oln1We

แหล่งที่มา : http://css-tricks.com

Monday, 20 August 2012

How to parse RSS feeds with PHP

สำหรับบทความต่อไปนี้เป็นตัวอย่างการเขียนโปรแกรมสำหรับอ่าน RSS Feed ด้วย PHP โดยใช้ Document Object Model ลองดูตัวอย่างได้ที่นี่ครับ http://www.softarea51.com/tutorials/parse_rss_with_php.html

แหล่งที่มา : http://www.softarea51.com/tutorials/parse_rss_with_php.html

PHP Proxy Solution for cross-domain AJAX scripting

โดยปกติเราจะไม่สามารถเรียก AJAX ข้าม Domain ได้ เนื่องจากเป็นข้อกำหนดในเรื่องความปลอดภัย สำหรับบทความที่จะนำมาแนะนำต่อไปนี้เป็นวิธีการสร้าง Proxy โดยใช้ PHP เพื่อที่เราจะสามารถเรียกใช้งาน AJAX ข้าม Domain ได้ ลองเข้าไปดูบทความได้ที่นี่ครับ http://bit.ly/ONrztb

แหล่งที่มา : http://bit.ly/ONrztb

Sunday, 19 August 2012

Facebook - FB.getLoginStatus

สำหรับ Facebook Application การ check สถานะของ User เป็นสิ่งแรกๆที่ Application ควรจะทำเมื่อ load page เสร็จเรียบร้อย การ check สถานะการ Login โดยใช้ JavaScript SDK เราจะใช้ Function ที่ชื่อว่า FB.getLoginStatus ซึ่งมีทั้งหมด 3 สถานะดังต่อไปนี้ คือ

1. connected - สถานะที่ User logged in Facebook และ Authenticated Application ของเราเรียบร้อยแล้ว

2. not_authorized - สถานะที่ User logged in Facebook แต่ยังไม่ได้ Authenticated Application ของเรา

3. unknown - สถานะที่ User ยังไม่ได้ logged in Facebook

Social Application โดยทั่วไปมักจะ check สถานะ Login ของ User ทันทีที่ Page load เสร็จเรียบร้อย ซึ่งแทนที่เราจะเรียก FB.getLoginStatus โดยตรง เราสามารถ check สถานะ Login ของ User โดยกำหนดค่า status:true ตอนที่เราเรียก FB.init และ subscribe auth.statusChange event เพื่อขอรับ response object (ซึ่งจะเป็น response object เดียวกันกับที่ได้รับจาก FB.getLoginStatus) ค่าหลักๆที่สำคัญใน response object ได้แก่ response.status, response.authResponse.userID, response.authResponse.accessToken (ค่า accessToken เป็นค่าที่จำเป็นต้องใช้ในการเรียก Facebook APIs ในนามของ User ที่ Login อยู่ในขณะนั้น)

แหล่งที่มา : http://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus/