10 Easy jQuery Tricks for Designers

Sep 29 2009 by Kayla Knight | 53 Comments

There are plenty of jQuery tricks and techniques out there, and the vast and powerful jQuery library can meet almost anyone’s JavaScript’ing needs. Since jQuery makes JavaScript accessible to designers who want to add simple interaction and visual techniques into their design without knowing extensive programming knowledge, it’s worth a few moments to explore this excellent library.

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

Equal-Height Columns

continue reading »

20 Fresh jQuery Plugins to Enhance your User Interface

Sep 9 2009 by Kawsar Ali | 34 Comments

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!

1. SimpleModal

This jQuery plugin is a flexible and straightforward way of providing modal window functionality on your site.

SimpleModalSimpleModal Demo

continue reading »

Build an Elastic Textarea with Ext JS

Aug 28 2009 by Nuno Franco da Costa | 28 Comments

Build an Elastic Textarea with Ext JS

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.

continue reading »

10 Impressive JavaScript Animation Frameworks

Jun 28 2009 by Jacob Gube | 48 Comments

Complex and slick JavaScript-based animation has been made easier with the emergence of frameworks and libraries that give developers the ability to create stunning and eye-grabbing animation and transition effects that make it easy these complex tasks.

In this article, you will read about the top 10 JavaScript-based animation frameworks and libraries that will enable you to create engaging and captivating user experiences.

1. $fx

$fx

continue reading »

JavaScript Debugging Techniques in IE 6

May 15 2009 by Ben Dowling | 46 Comments

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.

JavaScript Debugging Techniques in IE 6

continue reading »

20 Excellent JavaScript Navigation Techniques and Examples

May 1 2009 by Kawsar Ali | 62 Comments

JavaScript allows you to add interactivity and feedback, making the user’s experience better and more intuitive.

Recently we showed you some exceptional CSS navigation techniques and we’d like to follow that up with an article about JavaScript-based navigation examples that you can use. Keep in mind that some of these techniques might not work if the client browser has JavaScript turned off (on average, 5% of users have JS disabled according to W3 web statistics).

In this article you’ll discover some terrific and unique JavaScript-powered navigation techniques and examples.

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.

1. MenuMatic

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.

menumatic

View Demo Page

continue reading »

40 Exceptional jQuery Interface Techniques and Tutorials

Apr 8 2009 by Jacob Gube | 62 Comments

With the advent of JavaScript/web application libraries and frameworks, it’s become much easier to build interactive components for a site. For the folks that are unfamiliar with jQuery – it’s a popular, high-performance and compact JavaScript library/framework. jQuery will allow  you to reduce the amount of code you have to write for dealing with browser quirks, memory leaks, and repetitive code by providing you with a set of useful and highly-optimized and thoroughly-tested functions and methods.

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.

Modal Windows

1. How to create a stunning and smooth popup using jQuery

How to create a stunning and smooth popup using jQuery tutorial screen shot.

continue reading »