Creating a Web App with jQuery UI

01 May 2009 | Design, Tools | andy
Quiet times in blog land as we’ve been busy in green field development with a new feedback platform for the V1 product line. I’ve been writing more code than normal and was greatly facilitated by using jQuery and jQueryUI.





Using jQueryUI’s inline modal, we support a seamless transition from non-logged-in state to logged-in even in the midst of write operations. For instance, you can, as an un-registered user, click to vote on an idea and then register, confirm, and return to the original window to commit your vote. This is an experience that a lot of sites get wrong… try favoriting on slideshare w/o being logged in, FAIL.

We’re using lots of base jQuery ajax functions as well as jQueryUI dialog, buttons, and skin elements.

The button system is pretty slick, supporting a number of states: primary, secondary, disabled, active, hover. This blog post is actually a better reference than the official docs.




jQueryUI’s theming system, called ThemeRoller allows configuration of the colors, corners, patterns, etc as well as generating several versions of standard icon canvases for a variety of options in icon coloring. Be sure to save the permalink for your themeroller config!

On the pure jQuery side, we appreciated Live Event Listeners which attach not just to the current DOM, but for all DOM that’s created — simplifying the process of adding interactive elements with script.

With a browser matrix including IE6 to Firefox and Webkit, jQuery was indispensable. We did design our IE6 support to be jettisonable in some hopeful future, accepting some visual downgrades and separating out exception rules for IE6 issues to a separate style sheet.

Nate Koechly at Yahoo describes extensively the challenges of modern UI engineering. Thanks to the jQuery folks for the getting us to a level where we could aim for superior experience. Hat tip to the Apache Lucene project, and specifically Lucene.net, for capable full text search.

转自：http://uxagile.com/2009/05/creating-a-web-app-with-jquery-ui/

$(document).ready(function(){dp.SyntaxHighlighter.HighlightAll('code');});

原文链接：
http://blog.csdn.net/vanessa219/article/details/4149184