So Badddd... Exteen New Features!

posted on 27 Apr 2008 06:48 by nosalaryguy in Javascript

ผมตั้งชื่อเอ็นทรี่นี้เรียกร้องความสนใจไปอย่างนั้นเองครับ เพราะความจริงผมติดใจฟีเจอร์ใหม่ใน exteen มากๆ (คำว่า BAD คือ โคตรเจ๋งครับ! [ ที่มา : slangsite.com ] )

งานนี้ต้องโทษ คุณแชมป์ ที่บันดาลใจให้ผมเกิดกิเลส กับฟีเจอร์ใหม่ครับ ตอนนี้ผมเริ่มจะติด exteen งอมแงมซะแล้ว เพราะรู้สึกว่าอยากจะหาของเล่นมาหมกไว้ในบล็อก ให้มันอลังการงานสร้างเละตุ้มเป๊ะไปเลย! ทั้งๆที่ก่อนหน้านี้ไม่นาน ผมเพิ่งจะพยายามกำจัดความรกออกหน้าบล็อกของตัวเอง โดยการเขี่ยรูปภาพทิ้งไปจากธีมให้หมด แล้วใช้ประโยขน์จาก CSS แต่ตอนนี้กลับบ้า javascript แทน... เวรกรรม!

เป็นเพราะผมชอบพล่ามอะไรยาวๆ เลยทำให้หน้าบล็อกนี้มีแต่ตัวหนังสือน่าเบื่อๆ (ก็เล่นเขี่ยรูปภาพทิ้งซะเกลี้ยงเลย) แต่เผอิญได้ไอเดียจาก Miguel Ripoll เว็บดีไซเนอร์ชาวสเปน และ Moo.FX Javascript Framework จาก MooTools ผมก็เลยเอา Accordion Effects มาใช้ในบล็อกนี้ เพื่อพับเก็บตัวหนังสือรกๆไว้ในลิ้นชักซะ เรียบร้อยโรงเรียน exteen (ใครที่เปิดจาวาสคริปต์ไว้คงเห็นไปแล้ว)

สำหรับ Miguel Ripoll ใครที่เห็นเว็บไซต์ของหมอนี้ครั้งแรก อาจจะถามว่า มันคือเว็บไซต์เหรอเนี่ย! ถ้าไม่เชื่อก็ลองคลิ๊กเข้าไปดูสิ เพราะครั้งแรกคุณจะเห็นแค่ตัวหนังสือสีดำไม่กี่ตัวบนพื้นหลังสีขาว และคุณจะไม่รู้ว่าหมอนี้ทำอะไร จนกว่าจะเอาเมาส์ไปจิ้มแล้วคลิ๊กที่ลิงค์ ซึ่งก็ไม่มีอะไรบ่งบอกอีกนั่นแหละว่ามันคือลิงค์ คนอะไรใจเด็ดเป็นบ้าเลย! (คนทำเว็บแบบนี้ ถ้าผู้ใช้งานไม่ get ก็คงโดนด่าเสียหมาครับ) แต่ที่ผมชอบมากที่สุด คือ ส่วน Portfolio ของเค้า ที่ใช้ Litebox (จาวาสคริปต์อีกตัวนึง) มาทำ Gallery ได้เท่มั่กๆ (ต่อมาถึงรู้ว่า มีเว็บดีไซเนอร์หลายคนใช้ลูกเล่นนี้เหมือนกัน)

ความจริงผมก็แอบเอา mootools กับ litebox ไปใช้ใน portfolio กิ๊กก๊อกของตัวเองนานแล้วเหมือนกัน ใครอยากเห็น ก็คลิ๊ก ที่นี่ครับ gallery อยู่ในส่วน web design ที่ซ่อนอยู่หลังตัวเลข 1-9 ครับ (ส่วนวิดีโอใช้ flash ในการแสดงผล) และอาจจะโหลดช้าหน่อย เพราะมันหนักจาวาสคริปต์กับไฟล์กราฟิค แถมใช้เซิร์ฟเวอร์ที่อเมริกาอีกต่างหาก และคนที่ใช้ Internet Explorer ก็ไม่ต้องแปลกใจที่เห็น layout มันประหลาดๆ เพราะ IE คือ กรรมของคนทำเว็บครับ! ผมยังชดใช้หนี้กรรมให้ Microsoft ไม่หมด

ส่วนอีกอันที่ไม่มี gallery แต่ทำไว้ขำๆ ลองดู ที่นี่ครับ ลองลากไอ้ก้อนพิกเซลยิ้มให้มันกระเด้งดูนะครับ อันนี้ไร้สาระสุดๆ แต่ภูมิใจนำเสนอมาก เพราะผมใช้เวลาทำมัน 1 วันเต็มๆ! แต่อย่าเพิ่งไปบอกใครเชียว ว่าผมแอบทำ portfolio ไว้ เพราะผมอาย... ตอนนี้ยังทำไม่เสร็จน่ะ ว่าจะโค้ดเป็นธีมของ CMS ตัวโปรดอย่าง Drupal แต่ 2 เดือนผ่านไป ผมก็ลืมซะสนิท (ขอบคุณฟีเจอร์ใหม่ของ exteen ที่ทำให้นึกขึ้นได้ ว่าผมทำอะไรค้างไว้ ^^)

ผมคงไม่พูดถึงเรื่องเทคนิคนะครับ เพราะผมก็อาศัยลูกมั่วไปเรื่อยๆ ไม่ค่อยมีหลักการอะไร แต่ถ้าใครสนใจก็สอบถามกันได้ เราจะได้ช่วยกันมั่วให้หนำใจ คำแนะนำคร่าวๆที่พอจะบอกได้ สำหรับการนำ Javascript Framework ต่างๆ มาใช้กับ Exteen Blog ก็คือ คุณต้องเขียน xHTML + CSS ได้ถูกหลักการ (แนะนำให้ศึกษาได้ที่ อนุบาลเวิร์ดไวด์เว็บ : W3 Schools) และเข้าใจเรื่อง Javascript อีกนิดหน่อย แล้วก็อย่าใช้มันมากเกินจำเป็นจนมันรบกวนส่วนที่เป็นเนื้อหา (unobtrusive javascript : หน้าเว็บของเราควรจะเข้าถึงได้ ไม่ว่าผู้ใช้งานจะเปิดจาวาสคริปต์หรือไม่ก็ตาม [ ที่มา ] ) เพราะผู้ใช้งานเว็บหลายคนไม่ได้อยากเห็นลูกเล่นของเรานะครับ บางคนทนไม่ได้ที่เห็นหน้าเว็บโหลดนานเกิน 4 วินาทีด้วยซ้ำไป! [ ที่มา ] หลังจากเข้าใจเรื่องยุ่งๆพวกนี้แล้ว ก็อาศัยลูกมั่วเฉพาะตัวของแต่ละบุคคลไป หรือไม่ก็ ลองสอบถามจากผู้ชำนาญการ อย่างเช่น คุณOatato น่าจะเข้าท่ากว่าการมั่วไปวันๆแบบผมนะครับ

ปล.1 สำหรับผู้ใช้ IE ถ้าเข้ามาบล็อกนี้ แล้วเจอคำเตือนของ ActiveX ก็ไม่ต้องตกใจนะครับ เพราะผมบีบจาวาสคริปต์มาด้วย eval function ของนาย Dean Edwards บราวเซอร์ของคุณอาจไม่ไว้ใจจาวาสคริปต์ตัวนี้ เพราะมันดูคล้ายกับพวก malicious scripts แต่ผมยืนยันว่า ไม่ได้หมกเม็ด หรือใส่อะไรที่เป็นอันตรายลงไปในโค้ดแน่นอน (เพราะทำไม่เป็น! ฮา...)

ปล.2 ผมสังเกตตัวเองอยู่เหมือนกันว่าเอ็นทรี่หลังๆ ผมชอบใส่ "ปล." โดยไม่จำเป็น ว่าจะเลิกใช้แล้ว แต่ยังทำใจไม่ได้...