Archive for the ‘ jQuery Example ’ Category

jQuery UI Multiselect

jQuery สำหรับสร้าง MultiSelect Option ที่สามารถเพิ่มและลบ Item ได้ สะดวก และรวดเร็ว

It depends on jQuery 1.4.2 and jQuery UI 1.8. The widget is styleable using Themeroller. It works in an unobtrusive fashion, by just turning html multiple select inputs into a sexier equivalent. There’s no extra markup needed.

* For installation instructions please have a look at the corresponding blogpost
* Source code is available at Github
* In case you are looking for the original version, it has been moved here
* Bleeding Edge Demo is always available here (thanks to Github Pages)

http://quasipartikel.at/multiselect/

jQuery Sliding Box and Captions

ช่วงนี้คงมี jQuery แปลก ๆ ใหม่ ๆ น่าสนใจ เอามานำเสนอเยอะหน่อยนะครับ เพราะว่า นั่งหาไปด้วย ทำงานไปด้วย

Sliding Boxes and Captions with jQuery ก็เป็น 1 ใน 25 jQuery Slide ที่ฝรั่งเค้าแนะนำครับ ผมว่าหน้าตา และ action effect ก็ทำได้สวยงามเลยทีเดียวครับ

ลองไปใช้กันดูครับ
live demo : https://buildinternet.s3.amazonaws.com/live-tutorials/sliding-boxes/index.htm

jQuery Fancybox Dialog

ค้นไปค้นมา ไปเจอ jQuery Dialog จากค่าย Fancybox อีกตัว หน้าตาและคุณสมบัติ ก็ใช้ได้ดีเลย เห่อๆ

FancyBox is a tool for displaying images, html content and multi-media in a Mac-style “lightbox” that floats overtop of web page.
It was built using the jQuery library. Licensed under both MIT and GPL licenses

Features

  • Can display images, HTML elements, SWF movies, Iframes and also Ajax requests
  • Customizable through settings and CSS
  • Groups related items and adds navigation.
  • If the mouse wheel plugin is included in the page then FancyBox will respond to mouse wheel events as well
  • Support fancy transitions by using easing plugin
  • Adds a nice drop shadow under the zoomed item

http://fancybox.net/

jQuery Dialog Plugin from Malsup

วันนี้ นั่งหา jQuery สำหรับทำ dialog box อยู่พักใหญ่ กว่าจะเจอที่ถูกใจ และเอามาใช้งานได้ เล่นเอา Google เหนื่อยเลย ^__^ ”

สำหรับ Dialog box ของค่าย MalSup นี้ ก็ถือว่าใช้งานได้สะดวกสบายดีคับ ไม่มี code อะไรยุ่งยากมาก แค่ใส่ code ไม่กี่ตัวก็ได้ dialog box สวย ๆ ไว้ใช้งานแล้ว

ปรับแต่งอีกหน่อย ก็เอามาร่วมทำงานได้อย่างสมบูรณ์แล้วครับ

ใครว่าง ๆ ก็ลองหยิบไปใช้กันดูนะครับ
http://malsup.com/jquery/block/