มี Form น่าสนใจอยู่ตัวหนึ่งมาแนะนำครับ สามารถเปลี่ยน Theme ได้ด้วยครับ ลองโหลดไปเล่นกันดู Download : http://pixelmatrixdesign.com/uniform

สดๆร้อนๆกับ jQuery 1.4.2 ครับ ออกกันมาเมื่อไม่กี่วันนี่เอง เดี๋ยวจะเอามา Review กันดูครับว่ามีอะไรเพิ่มมาบ้าง เท่าที่อ่านผ่านๆก็มีเพิ่ม Methods มาใหม่สองตัวคือ .delegate() กับ .undelegate() ความเร็วนั้นเพิ่มขึ้นด้วยนะครับ Download: jQuery 1.4.2

Dropdown แบบเก่ามันธรรมดาไป วันนี้เรามี Image Dropdown JQuery Plugin แบบมี Icon มาฝากครับ ดูจากรูปเป็นไงครับ สวยงานไปอีกแบบนึงนะครับ ใครสนใจก็ไปโหลด Code หรือ ไปดู Demo ได้ตามลิงค์ด้านล่างนะครับ Website : http://www.marghoobsuleman.com/jquery-image-dropdown Demo : http://www.marghoobsuleman.com/mywork/jcomponents/jquery-image-dropdown/index.html

มาดูวิธีการใช้งาน jQuery กันแบบย่อๆกันบ้างนะครับเปลี่ยนบรรยากาศกันหน่อย ผมว่ามีประโยชน์มากๆเลยครับ เพราะจะได้เรียนรู้วิธีการเขียน jQuery หรือการเรียกใช้ Function บาง Function ที่เราไม่เคยใช้ หรือเอาไว้ศึกษาวิธีอื่นๆในการเขียนที่ชาวต่างชาตินิยมเขียนกันนะครับ – วิธีการ Refresh src ของ IMG นะครับ 12$(imageobj).attr(’src’, $(imageobj) .attr(’src’) + ‘?’ + Math.random() ); – วิธีการ เช็คว่า Image นั้นโหลดเสร็จแล้ว หรือโหลดไม่ได้ 123456var imgsrc = ‘img/image1.png’; $(’<img alt="" />’).load(function () { alert(’image loaded’); }).error(function () { alert(’error loading image’); }).attr(’src’, imgsrc); – วิธีการ ไม่ให้ Click ขวา 12345$(document).ready(function(){ $(document).bind("contextmenu",function(e){ return false; }); }); – วิธีสั่ง Run Function 5 ครั้งทุกๆ 20 วินาที 1234567var count = 0; [...]

ถ้าจะกล่าวถึง jQuery + Ajax แล้วละก็ที่ขาดไม่ได้เลยก็คือ JSON เพราะสามารถนำมาใช้งานได้สะดวกและง่าย เพราะข้อมูลที่เป็นรูปแบบ JSON นั้น Ajax สามารถที่จะเรียกข้อมูลนั้นๆออกมาเป็น Object ได้ JSON คืออะไร json นั้นย่อมาจากคำว่า ” JavaScript Object Notation ” จริงๆแล้วข้อมูลที่อยู่ในรูปแบบของ JSON นั้นก็คือ Text ธรรมดาๆครับ เพียงแต่ถูกจัดเรียงให้อยู่ในรูปแบบของ Object Array ถ้าอธิบายวิชาการไปเรื่อยๆนี่สงสัยจะงงกันแน่ๆ มาดูตัวอย่าง รูปแบบของ JSON เลยละกัน 12345678910111213141516{     "firstName": "John",     "lastName": "Smith",     "address": {         "streetAddress": "21 2nd Street",         "city": "New York",         "state": "NY",         "postalCode": [...]

เมื่อหลายวันก่อนเปิดหน้าเว็บ Google แล้วไปเจอลูก Apple ตกลงมา อ๋อวันเกิดของ นิวตัน นี่เอง แต่จากวันนั้นมีหลายคนถามครับว่า รูป Apple ที่ตกลงมานั้น เขาทำ Animation อย่างไรให้ภาพมันตกลงมาแล้วก็กระเด้งๆๆ วันนี้เปิดๆหาข้อมูลของ jQuery ก็ไปเจอเว็บหนึ่งครับ ที่ทำพวก Effect สำหรับทำ Animation ไว้เยอะพอดูเลยละ ลองเข้าไปทดสอบกันดูครับ มี Effect ให้เลือกใช้เยอะเลย ตัวอย่างการเรียกใช้งาน 1   $("#element").effect([speed, callback]); Demo : Click here Web site : http://net.tutsplus.com

วันนี้มี Plugin สำหรับทำ Google Maps ให้โหลดกันครับ ก่อนใช้งานก็ต้องไปสมัคร Google API Key ก่อนนะครับ ถึงจะใช้ได้ โดยใช้แค่ Account ของ Gmail ในการสมัครครับ ลองมาดู หน้าตาของ Code กันครับว่าง่ายแค่ใหน 123456$(document).ready(function() {       $(’selector’).googleMaps({         latitude: 49.26063518364422,         longitude: -123.15673828125     });   }); การกำหนดค่าต่างๆนั้นมีให้เยอะพอสมควร สามารถดูจากตัวอย่างในเว็บของทางผู้พัฒนาได้เลย หรือใน Document เลยก็ได้ครับ Download : Click Here Web Site & Example : Click Here

Search highlighter by jQuery มี tip เล็กมาแนะนำครับ คือการเน้นข้อความ โดยใช้ jQuery ครับ โดยจะเอามาประยุกต์ใช้กับ การค้นหาข้อความ มาดูตัวอย่างกันได้เลย ส่วนของ html และ css 1234567891011<style type="text/css"> .highlight { background-color:yellow } </style> <input id="txtSearch" name="txtSearch" type="text" /> <input id="btnSearch" name="btnSearch" type="button" value="Search" /> <div id="divContent">This is the recommended version of jQuery to use for your application. The code in here should be stable and usable in all modern browsers. The minified versions, while having a larger file size than the packed versions [...]

มีวิธีการบีบอัด file javascript มาฝากกันครับ การบีบอัดสำหรับ file javascript ก็คือการ นำเอา ข้อความที่อยู่ใน comment ( /* … */ ) และ characters whitespace ที่ไม่จำเป็นออกครับ ขั้นแรก ให้ไป Download ตัว Script ที่ใช้ในการบีบอัดก่อนครับ เราจะใช้ตัว JSMin โดยผ่านทาง command-line ครับ Download ได้ที่นี่ครับ >>JSMin ตัวอย่าง script ก่อนการบีบอัด : 12345var stop = 10; for (i=0;i alert(i); } ตัวอย่าง script หลังการบีบอัด : 1var stop=10;for(i=0;i&lt;stop;i++){alert(i);} มาดูตัวอย่างการใช้ command-line ในการบีบอัดกันครับ รูปแบบคำสั่ง :      jsmin <source_yourscript.js > destination_yourscript.js ก่อนบีบอัด การใช้ command-line หลังการบีบอัด

jQuery Advance Event Timeline พอดีไปเจอโปรแกรมตัวหนึ่งที่น่าสนใจครับ เป็นระบบ Event Timeline ที่ทำจาก PHP+jQuery หน้าตาสวยงายเลยทีเดียว เอามาแบ่งปันเผื่อมีใครกำลังหาโปรแกรมแบบนี้อยู่ครับ ผมว่าน่าสนใจดีเลยครับตัวนี้ ลอง Download มาใช้กันดูครับ สามารถเอาไปต่อเติมกับระบบเช่นพวก เว็บที่มีระบบ Event Calendar สามารถนำมาแสดง Event ในแต่ละปีของเราได้เลย ว่ามีอะไรบ้าง  หรืออาจจะเอาไปเปลี่ยนเป็นระบบ Project Timeline ก็ได้นะครับ แต่อาจจะต้องเขียนเพิ่มเติมอีกนิดหน่อย โดยใช้ในส่วนนี้เป็น UI ที่สวยงามอีกแบบครับ ยังไงไปลองกันดูครับสำหรับ jQuery Advance Event Timeline Download : ได้ที่นี่ครับ Demo : ดูได้ที่นี่ครับ