As any designer knows, adding small bits of extra visual detail and user-friendliness can add professionalism and appeal to any web design. In addition, for designers that sell templates, WordPress themes, and other types of web designs, the use of jQuery in a design can be a great selling point.
Let’s take a look at ten simple, effective, and useful tricks and techniques from several excellent jQuery developers and sites around the web that leverage the library to take your designs to another level.
1. Equal-Height Columns
The great thing about jQuery is that talented jQuery developers often release new and useful plugins on a regular basis. jQuery plugins are not only easy to implement, but easy to maintain even when used throughout large sites.
In this article, we share with you a list of 20 useful jQuery plugins that were released recently that could help you for your next web project. There are various types of plugins here such as modal windows, image galleries, auto complete for form input, bookmarking functions, preloaders, and more. Enjoy!
This jQuery plugin is a flexible and straightforward way of providing modal window functionality on your site.
Since it was first featured on Facebook, elastic textareas –
<textarea> elements that automatically expand or shrink depending on how much text the user inputs – has become one of the coolest functional UI effects on the web. In this article, I will guide you through the re-creation of this astonishing effect using Ext JS, and I bet you that you will be surprised to see how easy it is to do it.
Microsoft’s Internet Explorer 6 is almost universally hated by web developers. It’s hard to work with and support, but with a few solid techniques, you can make the process less painful. What “just works” in the majority of browsers will almost always require hours of tweaks and workarounds to get it working in IE6. With more and more users switching over to newer alternatives such as IE8, Safari and Firefox hopefully support for IE6 can be dropped sooner rather than later. In the mean time though many of us have to make sure our sites work in this awful browser.
Tip: clicking on each image will take you directly to the demo page of the navigation menu technique if it’s on a separate page. Their names will take you to their project web page.
This example takes semantic ordered or unordered list of links and turns it into a dynamic drop down menu system that can be vertically or horizontally oriented.
In this article, we explore the strengths of jQuery in letting web developers create impressive client-side-based user interface components. Whether you’re looking for a particular interface/interaction pattern built on Query (like module tabs or modal windows) or you simply want to learn the library by engaging in step-by-step tutorials – you should be able to find something here for you.