jQuery UI: Interactions and Widgets

Posted on by
Meet the jQuery UI team at jQueryCamp Boston!
We’re having a free one day conference this October and most of the jQuery, and jQuery UI, teams will be there. Come along, ask questions, and meet the people who build the library that you love!

User Interface - Green

Today we’re very pleased to announce a brand new library: jQuery UI. jQuery UI is a fully themed interaction and widget library built on top of jQuery.

You’ll be able to find everything that you need to know about jQuery UI on it’s site:
http://ui.jquery.com/

jQuery UI signals the start of a whole new branch of the jQuery project which will focus on developing high-quality, reusable, components that you’ll be able to drop in your applications. Frequently, these components are coming directly to you from traditional jQuery plugins, but with strict coding, documentation, themeing, and demo standards. We hope you’ll enjoy this new level of quality as much as we do.

We’re launching with one complete theme: Flora (designed by Tom) and two partially-complete themes: Light and Dark (by Sean). Within the next week we’re going to be announcing the details of a new theming competition, along with everything that you need to completely build your own jQuery UI theme.

Note: jQuery UI requires that you use, at least, jQuery 1.2.1 or newer.

Please be kind, there’s still going to be a mess of rough edges, as is to be expected with a brand new project. Please submit bugs to the bug tracker under the “UI” component and bring them up for discussion on the jQuery UI Mailing List. We appreciate your help.

Without further ado, here’s jQuery UI!

Demo App: Advanced Image Gallery

(Currently has issues in IE and Safari – we’re working on some fixes which should be up later today.)

Demo App: Bar Chart Navigation

(Currently only works in browsers that have Canvas support: Firefox, Safari, and Opera.)

Features: Mouse Interaction

Draggables (Docs)

Droppables (Docs)

Sortables (Docs)

Selectables (Docs)

Resizables (Docs)

Features: Widgets

Accordion (Docs)

Calendar (Docs)

Dialog (Docs)

Slider (Docs)

Tablesorter (Docs)

Tabs (Docs)

Features: Effects

Magnifier (Docs)

Shadow (Docs)

Contributors

This is the result of many months of work by over a dozen people – many of whom were first time contributors to jQuery.

For now, here’s a rough list of everyone who helped, and what they helped with. (Please let me know if I forgot anyone!)

  • Paul B (Draggables, Droppables, Sortables, Resizables, Slider, Shadow, Magnifier, Gallery App)
  • John (Documentation, Theming, Demos, UI Site, Cat Herding)
  • Richard (Tree, Selectables, Sortables, Dialog, many bug fixes)
  • Tom (Flora theme, UI Site, and UI logo)
  • Sean (Theming, Dark and Light themes, Shadow, Forms)
  • Klaus (Tabs)
  • Joern (Accordion)
  • Christian (Tablesorter)
  • Adel (Downloader, Client-Side)
  • Paul H (Downloader, Server-Side)
  • Marc (Calendar)

With additional help from: Tane, Micheil, Gilles, Dmitri, and Yehuda. Much of their work will be seen in the next release of jQuery UI (including menus, toolbars, uploaders, splitters, and rich text editors).

I’d like to do a more-detailed write up of what everyone put into this project to thank everyone individually, as everyone did a really fantastic job of pulling together and making this happen. Paul, Tom, Richard, and Sean, especially – you guys did a superb job!

Once again, I hope everyone enjoys this new work – please be kind, it’s still got some very rough edges, so to speak. If you spot any bugs, please post them to the bug tracker under the “UI” component.

As always, feedback is appreciated! If you’d like to let us know what you think, please post to the jQuery UI Mailing List, or hop on irc.freenode.net #jquery-ui, as those are the best place to be able to find us.

Enjoy!

If you like what you see, feel free to give it a digg.

110 thoughts on “jQuery UI: Interactions and Widgets”

  1. Greg on said:

    This is great stuff, fun stuff … will be eager to watch it mature. But I’m glad to see it’s a separate download and I hope it stays like that.

    Just please keep this stuff separate from the jQuery core. 4 months ago this designer/developer didn’t care to bother with jquery and javascript/ajax ‘tricks’ for sheer usability/dev time reasons … now i can’t develop w/o it . Designing for browsers was, is, and will always be a waste of time for all but large budgets. Jquery’s extremely efficient size/speed/convenience/dependability/stability are why i use it daily.

    I for one am happy jquery isn’t like EXT … with it’s file size issue and memory bloat. But this is cool stuff.

    You guys make it too easy for anyone to develop kick ass sites, quit it already!

  3. Johnnie xu on said:

    wow!!! I don’t want to say so ,but i cann’t say so.
    Well done , grandeur work!
    A congratulation to all people of the work from CHINA!

  6. Pingback: Bram.us » jQuery UI

  8. Pingback: jQuery 1.2 + jQuery UI 1.0 | CNET.ro

  9. Pingback: JavaScript: jQuery UI 1.2.1 » Wake Up!

  13. Pingback: Christian Pfeil » jQuery UI: Widgets, Components, and Interactions » jQuery UI: Widgets, Components, and Interactions

  17. LVB on said:

    This is promising but from what I’ve been able to test, I believe this should have been called a beta (or an alpha ?) rather than a 1.0 release. There are still plenty of bugs, even in the demo featured on the official web page.

    Looking forward for the next release, I hope the UI modules will reach core’s overall quality very soon. I’m eager to benefit the power of jQuery 1.2.1 in using UI widgets.

  18. Pingback: NOWG.net » jQuery Plug-ins

  19. Pingback: » jQuery 1.2 e jQuery UI » Full(o)bloG

  20. Pingback: Arriva User Interface per jQuery, nasce web 2.1!

  21. Pingback: My Cup of Java - Today’s Top Blog Posts on Java - Powered by SocialRank

  22. Bear Deon on said:

    Opera 9.1 … Большенство эфектов не сработало! =(

  23. Pingback: Info World » Blog Archive » Code library aims to fuel easier JavaScript handling

  24. Devin on said:

    This is amazing! What a pity it wasn’t done before I finished my major web project. Finishing my 9 month systems development project for my honours degree and handin is 5 days away. Will definately use it in the future!! Well done again.

    Cheers

    Devin

  27. Alexandre Magno on said:

    jQuery is a simple fantastic, powerful and a complete javascript framework. Im adopting in all my projects… but now, in a first bigger project, using ajax and a lot of form integration, I see that with jQuery we can make all we want, we can just aply with wisdow. Congratulations for the jQuery team, Ray Bango and company and I would make the possible to spread this framework on south america…. thanks…

  28. Pingback: Klaus Hartl - Stilbüro : jQuery UI Tabs aka Tabs 3

  29. Sorpigal on said:

    Some of the demos, specifically Resizable, Magnifier, Slider and Shadow, do not work in my Firefox (2.0.0.8, Windows). Also, the link to Advanced Image Gallery leads to a 404.

    But what works, works. Keep up the good work.

  30. Rob on said:

    Why are there so many issues with IE7? As much as everyone hates MS surely it makes sense to make it workable on the most popular platform.

  31. ionutz on said:

    we waiting for a fully working on ie6/7. The sortables, for example, have weird behavior on ie6. Until few days ago, sortable didn’t work even on firefox…

  32. goetsu on said:

    Great job !

    Did you think that on the next version you can add native support of ARIA spec like Dojo do for example.
    http://www.w3.org/TR/aria-roadmap/
    http://www.w3.org/TR/aria-role/
    http://www.w3.org/TR/aria-state/
    http://developer.mozilla.org/en/docs/Accessible_DHTML

    ARIA is already supported by Firevox, last version of Jaws and window eyes 5.5. Furthermore Firefox 3 and Opera 9.5 will have native support of it too ( this way people wouldn’t have to use a separate js to use it in html )

  33. Kolja on said:

    Anyone knows, if I can get an array of elements sorted with sortable script. Is this posible?
    tnx!

  35. Pingback: programmazione » Blog Archive » jQuery 1.2 e jQuery UI

  36. paaboo on said:

    jquery-ui is so nice! thx for all of developers of jquery,

    now i have a problem , when i use a resizable effect,i can not use “grid” options to make it be resized by grid…

    someone who can help me ?

  40. Paul on said:

    Looks good. The last shadow demo, with the draggable/resizable picture… says it works in FF but not IE.

    For me in FF 2.0.0.10/WinXP the resize and drag work… but the shadow stays the same. Shouldn’t the shadow also be refreshed to match the shape and position of the box it’s attached to?

  43. Faisal on said:

    is there tabs implementation without background images. This is making its implementation very limited in size. The best idea is to implement tabs without images like other libraries do.

    Klaus may have his view on this.

  44. Pingback: jQuery UI: Interactions and Widgets | Development Feeds

  45. Chad on said:

    FYI, your download JQuery UI “plugins” dialog is broken. Nothing happens when the download button is clicked (after checking the desired plugins).

    I’ve tried in IE, FireFox and Safari on two XP boxes. Nothing. The “themes” and “everything” tabs seem to work just fine.

  47. Londyn on said:

    Hi, my name is Krzysztof London. I think this is more an issue of trust than anything. I would like to show the demos to some people but if they see those warnings they will never trust jQuery, particularly when there are some Flex developers bragging at their other ear about how they work the same in all browsers (not 100% true, but whatever).

  48. Pingback: Enlaces de la semana: mis plugins para jquery | SEO, marketing online y posicionamiento web en formato blog