Hot off the Presses: jQuery UI v1.5 featuring “Themeroller”

jQuery UI version 1.5 was just released, and it’s going to be a big one. For us designers and CSS coders, here are a couple of major highlights:

• Class transitions (morphing): $(“div”).addClass(“green”, “slow”). So now instead of being able to “instantly” add a class to any page element (which instantly applies all CSS attributes from that class), we can now “morph” into that class (which will animate into the CSS attributes in that class).
• Easier file structure. This just means it is going to be easier to get up and running with jQuery UI because it has much less dependencies. Since jQuery 1.2.6, the dimensions stuff has been built in, so no more need to include that separately. Also no more need for the UI Core and UI Mouse.
• Stand-alone effects. If you were a Prototype holdout because of script.aculo.us, hold out no longer. Every known effect from script.aculo.us is now included (blind, bounce, drop, fold, slide, puff…), only now more configurable. There are also some new really cool ones like transfer, explode, clip and scale.
• …and that’s not all. That is just the tip of the iceberg. Peruse the juicy changelog for yourself.

Themeroller

This is the most exciting part for people new to jQuery and to jQuery UI. Probably the most common reason for people (especially designers) to pick up a javascript library is so they can build in things like tabbed boxes, accordions and date pickers and little bits like that without going through all the work it takes to write something like that from scratch.

jQuery made those things easy to do and jQuery UI made them even easier. But you still had to do all of the designing and customization on your own through CSS. Of course we want to have that control, but wouldn’t it be nice if we didn’t have to do it from scratch? That’s where Themeroller comes in. Themeroller is part of the jQuery UI site where you can design and build your own custom theme for your own suite of widgets. Simply adjust the colors, fonts, and textures to your liking and it will customize a download for you with all those widgets in your custom style ready to rock. Doesn’t get much easier than that!

Thanks and Credits

I want thank Rey Bango for letting me have a sneak peak of all this stuff as they were working on it. Rey is a part of the jQuery team as an evangelist.

Special thanks goes out to the Filament Group, who built the amazing Themeroller.

Special thanks has also been given to the Liferay staff, who invested countless hours into the development of the new UI website, and with whom the jQuery worked closely together with to stabilize jQuery UI for all kinds of enterprise situations.