สร้างนาฬิกาสีสันแบบเก๋ๆ ด้วย CSS & jQuery


วันนี้เป็นการสร้างนาฬิกาด้วย CSS และ jQuery โดยการใช้ css ในการจัดการสีและรูปแบบหนุมของรูปวงกลมที่ใช้ในการหมุนคล้ายกับเข็มนาฬิกาโดยเวลาที่กำหนอจะเป็นเวลาปัจุบันโดยกำหนดเป็น 24 ชั่วโมง โดยรูปแบบของหน้า index จะเป็นการใช้ XHTML เป็นมาร์กอัปโดยการใช้ Div และเรียกใช้งานเอาครับ

Continue reading สร้างนาฬิกาสีสันแบบเก๋ๆ ด้วย CSS & jQuery

ทำเครื่องเล่นเสียงที่ตอบสนองต่อการสัมผัสด้วยปลั๊กอิน jQuery และ CSS [responsive]


เป็นอีกบทความที่เอามาแนะนำในเรื่องของปลั๊กอิน jQuery และการใช้ css โดยการสร้างปุ่ม play สำหรับการเล่นเพลงที่จะสามารถเล่นเพลงได้ทั่วไปแต่ส่วนใหญ่จะเป็นการใช้ media player หรือ flash ซึ่งจะต้องมีการลงปลั๊กอินในการใช้งานของแต่ล่ะบราวเซอร์โดยรูปแบบการสร้างเครื่องเล่นเพลงในวันนี้อย่างที่บอกครับจะเป็นการสร้างโดยปลั๊กอิน jQuery และ css โดยจะสามารถเล่นและแสดงผลได้ทุกบราวเซอร์และสามารถใช้ css เข้ามาช่วยในการออกแบบอีกด้วยแต่ที่น่าสนใจคือการสร้างแบบ RESPONSIVE ที่สามารถย่นย่อขนาดของเครื่องเล่นให้เข้ากับขนาดหน้าจอต่างๆได้เช่นบนหน้าจอของ iphone ipadmini หรือมือถืออื่นที่มีขนาดหน้าจอต่างๆ ก็จะสามารถปรับขนาดได้ตามอัตโนมัตินั้นเองเรามาลองดูตัวอย่างกันเลยดีกว่าครับ

Continue reading ทำเครื่องเล่นเสียงที่ตอบสนองต่อการสัมผัสด้วยปลั๊กอิน jQuery และ CSS [responsive]

สร้างไอคอนรูปภาพโดยไม่ต้องใช้ภาพด้วย CSS แท้ๆ


ก่อนหน้านี้ที่ผมเคยแนะนำการสร้างไอคอนโดยไม่ต้องใช้รูปภาพและการใช้ CSS เข้ามาช่วยในการพัฒนาเว็บไซต์วันนี้ก็เป็นอีกรูปแบบหนึ่งที่เป็นการใช้ css ในการกำหนดจุดต่างๆและสร้างไอคอนเป็นรูปภาพเพื่อใช้ในเว็บของเราข้อดีก็คือมันสามารถที่จะขยายขนาดได้เลื่อยๆและทำให้เว็บเราโหลดไม่โหลดรูปภาพนานๆอีกด้วยครับเป็นอีกแนวทางในการเลือกใช้เทคโนโลยีใหม่เพื่อการพัฒนาเว็บไซต์ให้มีประสิทธิภาพมากยิ่งขึ้นนั้นเอง

Continue reading สร้างไอคอนรูปภาพโดยไม่ต้องใช้ภาพด้วย CSS แท้ๆ

สร้างสไลน์รูปภาพแบบ 3D ด้วยปลั๊กอิน jQuery และ CSS 3D


StackSlider คือปลั๊กอิน jQuery ที่ผู้พัฒนาได้ทำการทดสอบเพื่อให้ผู้พัฒนาลองใช้งานร้วมกับ CSS 3D ที่ตอนนี้เริ่มมีการนำมาใช้งานกันอย่างแพร่หลายโดยวันนี้เว็บการสร้างสไลน์เลื่อนแบบเจ๋งโดยหลักการทำงานก็ไม่สลับซับซ้อนครับแต่เป็นการใช้เทคนิคที่น่าสนใจโดยการโชว์ภาพเลื่อนซ้าย ขวา แต่เพื่อความเลื่อนไหลและความสมูลในการเลื่อนเข้าไปด้วยด้านล่างที่คล้ายกับชั้นของภาพที่ซ้อนกันอยู่จะค่อยๆลดลงไปตามจำนวนภาพที่เลื่อนไปนั้นเองครับเราลองมาดูตัวอย่างกันเลยดีกว่า

Continue reading สร้างสไลน์รูปภาพแบบ 3D ด้วยปลั๊กอิน jQuery และ CSS 3D

ทำได้ง่ายๆกับเมนู DROP-DOWN สุดเจ๋งด้วยปลั๊กอิน jQuery และ CSS


มาต่อเนื่องครับกับการใช้ปลั๊กอิน jQuery โดยวันนี้จะเป็นการสร้างเมนู drop-down หลายเว็บไซต์ที่มีการพัฒนาเมนูรูปแบบต่างๆมากมายบางคนก็ใช้รูปบ้างเขียน css บ้างก็แตกต่างกันได้ครับโดยเมนูถือว่าเป็นสิ่งสำคัญอีกอย่างหนึ่งสำหรับการพัฒนาเว็บไซต์เพื่อให้ผู้ใช้ได้สามารถเข้าใช้งานในส่วนต่างๆได้อย่าง่ายได้ผู้พัฒนาจะต้องดูส่วนนี้เป็นจุดสำคัญโดยการเลือกใช้รูปแบบเมนูก็น่าสนใจโดยเราจะเห็นว่าเว็บไซต์ทั่วไปจะมีรูปแบบเมนูที่แตกต่างกันได้แนวแต่ความเหมาะสมและพื้นที่ในการออกแบบโดยวันนี้ผมเอารูปแบบของเมนู drop-down หลายรูปแบบที่น่าสนใจครับเป็นอีกเทคนิคที่น่าสนใจครับโดยเมนูมะมีรูปแบบการ drop-down ขึ้นลงทำให้ดูน่าสนใจเรามาลองดูกันดีกว่าครับว่าจะเจ๋งซักแค่ไหน

Continue reading ทำได้ง่ายๆกับเมนู DROP-DOWN สุดเจ๋งด้วยปลั๊กอิน jQuery และ CSS

ห้ามพลาด! สร้างระบบ Crop ตกแต่งรูปภาพด้วย API Dropbox


วันนี้เป็นการนำเอา API ของผู้ให้บริการใน้รื่องของการฝากไฟล์บนระบบ cloud รายใหญ่ที่หลายคนอาจจะรู้จักดีคือ dropbox เมื่อไม่นานมานี้ dropbox ได้เปิดบริการ API รูปแบบใหม่ที่สามารถจะนำไฟล์ที่ถูกเก็บไว้ใน Dropbox สามารถที่จะเอามาเก็บไว้ในเว็บไซต์ต่างได้ผ่าน API ตัวนี้ Dropbox api โดยวันนี้เราก็จะมาลองใช้เจ้า Api ตัวนี้กันโดยการทำงานง่ายๆคือการ crop รูปภาพที่เราฝากไว้ใน Dropbox นั้นเองหรือบางคนอาจจะใช้บริการซิ้งภาพจากอุปกรณ์เคลือนที่ของเรา โดยเราสามารถนำภาพที่เรามีนั้นมาปรับแต่งโดยการ Crop และสามารถที่จะเก็บไว้ในเว็บไซต์ของเราหรือผู้ที่ให้บริการ crop ภาพจาก dropbox ก็ได้ เราลองมาดูตัวอย่างกันดีกลัวครับ

Continue reading ห้ามพลาด! สร้างระบบ Crop ตกแต่งรูปภาพด้วย API Dropbox