Whattup guys! jQuery 1.4 is out and to be part of the celebrations, I'd like to introduce you to a couple Plugins and tehcniques that could be helpful when developing your next websites.
For those who never heard of it before, jQuery is a free, simple, lightweight JavaScript Library that "simplifies HTML document traversing, event handling, animating, and Ajax interactions for your rapid web development." It really speeds up your development and allows you to create a lot of cool effects without using Flash or complicated scripts. The best part of it? It is so easy to use and it's open source, so everybody can develop new plugins!
Similar JavaScript framworks exist, such as Mootools - Prototype - YUI, but since jQuery is the most popular library right now, I'm gonna focus on this one.
jQueryTasticStuff:
-
jQuery Validation Plugin - jquery.com
"Validate forms like you've never been validating before!"
-
"FancyBox is a tool for displaying images, html content and multi-media in a Mac-style "lightbox" that floats overtop of web page. It support fancy transitions by using easing plugin and it can display images, inline, ajax and iframed content. Also, note that it is fully customizable through settings and CSS..."
-
There are lots of gallery plugins out there, but this one is my favorite. It can be used in different format based on your needs, including Filmstrip or only Panels, and is fully customizable.
"GalleryView aims to provide jQuery users with a flexible, attractive content gallery that is both easy to implement and a snap to customize."
-
"Simpletip is a plugin for the popular jQuery JavaScript library. It allows you to create tooltips with ease on any element on the page using the power of jQuery's selectors and event management. The tooltips can be static, dynamic, or even loaded through AJAX with a variety of different visual effects..."
-
"I know there are quite a few tutorials out there that demonstrate how to create tabs with CSS & jQuery, but I decided to create my own as well. I’m not sure if the techniques are the same, but hopefully this tutorial will be easy to understand even for a beginner..."
-
Sexy Drop Down Menu w/ jQuery & CSS - www.noupe.com
"Studies show that top navigations tend to get the most visual attention when a user first visits a site. Having organized and intuitive navigation is key — and while most drop down menus may look aesthetically pleasing, developing them to degrade gracefully is also essential..."
-
Create a Fast and Simple Toggle View Content with jQuery - www.queness.com
Ok this one might sounds really simple and stupid, but the dynamic toggle feature is used more then ever on the Web right now. Just check Facebook, Twitter, SmashingMagazine, etc. to name few. Whit this technique, you're gonna save a lot of time and trouble to achieve it!
"This script is fairly straight forward. What it does is using the UL list and allow user to toggle to display the content of LI items. This is a really useful user interface feature that it helps designers to save space and build a less complicated user interface..."
-
"Uploadify is a jQuery plugin that allows the easy integration of a multiple (or single) file uploads on your website. It requires Flash and any backend development language. An array of options allow for full customization for advanced users, but basic implementation is so easy that even coding novices can do it..."
-
Using jQuery To Manipulate and Filter Data - net.tutsplus.com
This next article contains everything you need to create beautiful tables with Zebra Rows, Hover effect, Filtering Data, Column Sorting and more!
"When a webpage is designed to display large tables of data, a great amount of consideration should be dedicated to allowing the user to sort through the data in a structured manner. In this article, I will go over four techniques: hover effects, zebra rows, filtering, and sorting..."
-
Use jQuery with Google Analytics to Track Clicks on Outgoing Links From Your Site - think2loud.com
"So you have a nice site or blog with lots of links to other places. Wouldn’t it be nice to use the power built into Google Analytics to track those links, without having to add the necessary JavaScript to every link? Here is a very easy way: Add outbound link tracking to a new or existing site. Provided that your links to other sites have the REL attribute set, you can track them very easily with some help from jQuery..."
Books you should be reading instead of playing Xbox 360:
The Smashing Book: "The Smashing Book is a printed book about best practices in modern Web design. The book shares technical tips and best practices on coding, usability and optimization and explores how to create successful user interfaces and apply marketing principles to increase conversion rates. It also shows how to get the most out of typography, color and branding so that you end up with intuitive and effective Web designs..."
Web Form Design: Filling in the Blanks by Luke Wroblewski: "Forms make or break the most crucial online interactions: checkout (commerce), registration (community), data input (participation and sharing), and any task requiring information entry. In Web Form Design, Luke Wroblewski draws on original research, his considerable experience at Yahoo! and eBay, and the perspectives of many of the field's leading designers to show you everything you need to know about designing effective and engaging Web forms..."
Emotional Design: Why we love (or hate) everyday things by Don Normand: "Norman's analysis of people's emotional reactions to material objects is a delightful process, replete with surprises for readers who have rarely paused to consider why they like or loathe their belongings. He breaks down emotional reactions into three parts, labeled "visceral," "behavioral," and "reflective," asserting that "a successful design has to excel at all levels." Norman's examples of items ranging from bottles to hand tools fulfill this dictum, although he feels that designers do not often take emotion into account when formulating what an object should look like..."