วันศุกร์ที่ 13 พฤษภาคม พ.ศ. 2559

[CSS] แก้ปัญหาแสดงผลบน TV หลายขนาด


ปัจจุบัน TV นั้นมีทั้งขนาด 720p , 1080p รวมไปถึง 4K
ทำให้เกิดปัญหาตามมา
เนื่องจาก Design ถูก Fixed ที่ 1080p
จะทำ Responsive นั้น ก็ไม่สามารถทำได้ (แก้ยาว ฮาๆ)

ดังนั้น การแก้ปัญหาที่ง่ายและตอบโจทย์ที่สุดก็คือ CSS Transform
เราต้องคำนวณ Scale จากขนาดของการ Design คือ width=1920px (คือ 1080p)
ดังนั้นจะได้

  • TV Cinema 4K (width 4096px) = Scale 2.133 เท่า
  • TV UHD 4K (3840px) = Scale 2 เท่า
  • TV Full HD 1080p  (1920px) = Scale 1 เท่า
  • TV HD 720p (1280px) = Scale 0,666 เท่า

เมื่อได้ขนาด Scale แล้ว
มาถึง CSS เราจะใช้ @media only screen ใน การแยกขนาดจอ
โดยใช้ Script ดังนี้ .....

[PHP] Redirect "non-www" to "www"

ปัญหาเล็กๆ อย่างเช่น พิมพ์ www กับ ไม่พิมพ์ www
ตัวอย่างเช่น  http://www.[mydomain].com กับ http://[mydomain].com

อาจทำให้เกิดปัญหาใหญ่ๆ ได้
เช่น
  • Session ระหว่าง url ที่ "มี www" เป็นคนละตัวกับ "ไม่มี www" 
  • App Facebook Log ที่เราใส่ Site URL ได้แค่ 1 url
    ทำให้ต้องเลือกระหว่างจะพิมพ์ www หรือ แบบไม่พิมพ์ www
เป็นต้น


วิธีการแก้ไข
  • เราจะทำการ Force Redirect url ที่ "ไม่มี www"  >> ไปยัง url ที่ "มี www" 



วันศุกร์ที่ 6 พฤษภาคม พ.ศ. 2559

หาตำแหน่งของคุณด้วย Geo-location (HTML5)

เว็บไซด์ในปัจจุบันนั้นมีการพัฒนาไปมาก เพื่ออำนวยความสะดวกผู้ใช้งาน
วันนี้เราจะมาแนะนำ ในส่วนของ Geo-location
























Geo-location  นั้นเป็นการระบุที่อยู่ของผู้ใช้งาน
โดยถ้า Device ที่เป็น Mobile ก็จะใช้ GPS ในการระบุ
แต่ถ้าเป็น Wifi ก็จะใช้ตำแหน่งที่ใกล้เคียงจากผู้ให้บริการ


มาเริ่มกันเลย !
( จากที่ศึกษามานั้น Geo-location ใช้เฉพาะ HTML5 นะครับ )


วันอังคารที่ 20 พฤศจิกายน พ.ศ. 2555

jQuery Roundabout ลูกเล่น slide สวยๆ

ลูกเล่นสำหรับ Web User Interface สวยๆ มาอีกแล้วครับ
สำหรับเจ้า Roundabout

ลองเข้าไปดูตัวอย่างจาก http://fredhq.com/projects/roundabout/ ได้เลยครับ



สำหรับส่วนตัวผมก็ได้ใช้ในเว็บ www.Bahtor.com เหมือนกันครับ


หากให้ต้องการ ขายสินค้า ขายของออนไลน์ ประกาศขายฟรี เชิญได้ที่เว็บผมเลยนะครับ ^^

วันพฤหัสบดีที่ 20 กันยายน พ.ศ. 2555

Safari ใน iOS 6 สามารถ Browse File ได้แล้ว


จากการที่ต้องอึดอัดมานาน เกี่ยวกับว่า "ทำไม Safari บน iPhone iPad อัพโหลด ไฟล์ไม่ได้"
วันนี้ iOS 6 สามารถ ฺBrowse File ได้แล้วครับ ดูในคลิปเลยครับ

วันอาทิตย์ที่ 9 กันยายน พ.ศ. 2555

Javascript : Ajax Feeds ด้วย Timer (setTimeout vs setInterval) อันไหนดีกว่ากัน

ตั้งแต่ Facebook,Twitter เข้ามามีอิทธิพลกับวงการเว็บ
เราจะสังเกตุได้ว่า Facebook,Twitter มักจะมี พวก Feeds ข้อมูลอัปเดตอยู่ตลอดเวลา

แน่นอนคงหนีไม่พ้นที่จะต้องใช้ function เกี่ยวกับพวก "Timer"

แล้ว Timer ใน Javascript มีอะไรบ้าง ??  มาดูกันเลย

วันเสาร์ที่ 8 กันยายน พ.ศ. 2555

Javascript Object , แล้วทำไมต้องเขียนเป็น Object ??

หลายๆ ครั้ง อาจจะประสบปัญหาเรื่องชื่อของ Function ในการเรียกจาวา Script

ในที่นี้ผมขอยกตัวอย่างง่ายๆ เช่น สมมุติว่าเรามี Form อยู่สองอัน

อันแรก แสดง Form เกี่ยวกับกรอกข้อมูลของ น้องหมา
อันที่สอง แสดง Form เกี่ยวกับกรอกข้อมูลของ น้องแมว

ถ้าให้ง่ายๆ เลยเราก็เขียนกันแบบ


function showDogFrom() {
   $(' #dogArea ').show()
}

function showCatFrom() {
   $(' #catArea ').show()
} 

แต่วิธีที่จะนำเสนอต่อไปนี้ เป็นอีกวิธีหนึ่งที่จะช่วยให้การเรียกใช้ Function หรือ Attribute ต่างๆ จาก Object ได้ ด้วยวิธีง่ายๆ