transition

Tag: transition

CSS3 Dropdown Navigation

ตัวอย่างการเขียน เมนูแบบ dropdown

เมื่อก่อนหรือแม้แต่ตอนนี้หลายคนที่เข้ามาอ่านบทความคงแปลกใจว่า ทำไมผมเขียนบทความที่เกี่ยวกับเรื่อง Selectors ของ CSS ทั้งนั้น สาเหตุหลักๆ ก็เพราะว่า Property และ Value ของ CSS นั้นมันตายตัวครับ จำง่าย ทำบ่อยๆ ก็จำได้ มันไม่เปลี่ยนไปไหนนอกจาก W3C ได้เปลี่ยนเวอร์ชั่นของ CSS ใหม่ เพิ่มหรือลดลง แต่ถ้าเป็น Selectors แล้วนั้น เราไม่ค่อยได้เขียนซ้ำกันสักเท่าไหร่ในแต่ละงาน เพราะงานแต่ละชิ้นที่ทำนั้นมันมีความต่างในตัวของมันเอง เราจึงไม่สามารถใช้ Selector เดิมๆ ในการจัดการได้ แต่ ทั้ง properties และ values นั้น มันเหมือนเดิม

นั่นคือสาเหตุหลักๆ ที่ผมพยายามเน้นให้ท่านทั้งหลายทำความเข้าใจและลองปรับเปลี่ยนรูปแบบการสั่งงานของ CSS ด้วย Selectors ไปเรื่อย เพื่อจะได้หาความเหมาะสมกับงานได้

ในบทความนี้ก็เช่นกัน ทุกท่านจะเห็นว่าผมเขียน Selectors ของ CSS แปลกๆ มีแค่ Heading Level (X) เท่านั้นที่ถูกร้องขอให้มี Class

ยังเหมือนเดิม Class ของ HTML ไม่ได้มีไว้เพื่อให้เขียนคำสั่งของ CSS เข้าไป แต่เป็นการอนุโลมให้ใช้ได้ เพราะ Class เป็น Global Attribute เหมือนการเป็นของสาธารณะ ภาษาอื่นใดอยากมาใช้ก็เอาไปใช้ ไม่ว่ากัน

เพราะฉะนั้น การลด ขยะ Classes จึงถือเป็นความจำเป็นและเป็นหนึ่งในนโยบาย ประชาวิวัฒน์ ในยุค พ.ศ. 2554 ของเรา

ภาษา CSS มีความสามารถมากมายมาให้ใช้แล้ว ก็จงใช้ อย่าไปขยันน้อย ดันทุรังใช้แต่ Class และ ID Selectors ในการทำงาน

Apple กับหน้าพิเศษ HTML5 CSS3 ปัญหาที่ซ่อนความจริงไว้ข้างหลัง

จากข่าวสองมาตรฐานเรื่องล่าสุดที่ Apple ได้ออกตัวล้อฟรี เหม็นไหม้ยาง ในการสนับสนุน HTML5 CSS3 อย่างเต็มที่ พร้อมๆ กับทำ Micro site เพื่อแสดงความสามารถของ Safari ที่สามารถทำงานกับ คุณสมบัติใหม่ๆ ได้อย่างราบรื่นนั้น ไม่ว่าจะมองไปทางไหน ผมเห็น อาร์ทตัวพ่อ ทั้งไทยและเทศ ต่างวิพากย์ วิจารณ์ ในมุม Apple เลือกปฏิบัติ เพราะบังคับให้ดูเฉพาะใน Safari แถมยังพาดประโยคจิก กัด บราวเซอร์ ล้านปลั๊กอินเจ้าหนึ่งเอาไว้ด้วย

แม้แต่ Mozilla ก็ออกมาวิพากย์ บางอันกับเขาเหมือนกัน

จริงครับ Apple เลือกพูดเฉพาะส่วนที่ตัวเอง ถูก เท่านั้น เรื่องอย่างนี้เราคุ้นกันอยู่แล้วครับ เพราะไม่ใช่แค่ Apple หรอกครับผมว่า M$ เอง ก็เลือกหลับตาข้างหนึ่งเล่นบทนี้เหมือนกันในตอนที่สดสอบ IE9 พรีวิวล่าสุด ที่ออกมาบอกว่าตัวเองรองรับมาตรฐานได้สูงกว่าใครเพื่อน

ไม่ว่ายังไงก็ช่าง ผมขออย่างหนึ่งสำหรับคนทำงาน CSS HTML ที่รัก และชอบพัฒนาตัวเองอยู่เงียบๆ "อย่าหลงประเด็น" ในขณะที่คนอื่นต่างพากัน เฮโล เกทับ บัฟแหลก ด่า Apple อยู่นั้น ขอมองระหว่าง บรรทัด ของที่ซ่อนอยู่ข้างใน มีประโยชน์มหาศาล

จาก CSS3 Transforms ถึง CSS Motion Editor Designer

ภาพตัวอย่างการ transform ของ CSS3

ย้อนกลับไปเมื่อ 3-4 ปีที่ผ่านมา นับจากปีปัจจุบัน (2553) คำว่า CSS Designer เพิ่งถือกำเนิดขึ้นใจเมืองไทย เวลาผ่านล่วงไป สาม สี่ปี ก็จริง เป็น สาม สี่ปีที่ไม่ค่อยได้เดินไปไหนกัน อย่างไรก็ตาม เท่าที่ผมสังเกต บ้านเราถือว่าเดินตามเรื่อง CSS มาไกลกันอักโข แต่ก็ยังไม่ถึงขั้นที่เรียกว่าตามทัน

ในระดับบริษัท ห้างร้าน เริ่มมี แผนกเขียน CSS HTML แยกออกจาก Interface Design อื่นๆ แต่สำหรับบางบริษัท ยังทำแบบ All-in-one ก็เป็นอันเข้าใจว่า อาจจะด้วยความเบี้ยน้อยแต่หอยใหญ่ ก็ว่ากันไป

มองย้อนกลับไปข้างหลังแล้ว เรามามองโค้งแบบลูกยิงไกลของ โรนัลโด้ บ้าง ว่า ในอนาคตอันใกล้ ใกล้ นี้ ในเรื่องราวของการเขียน CSS HTML มันจะแปลกแปร่งออกไปจากเผ่าพันธุ์เดิมดั้ง ดั่งเคยเป็นมายังไงบ้าง

Back to Top