The Complete jQuery Resource List for You to Become an Almighty Developer

Have you ever had to develop something yourself only to find out that there had already been a plugin developed?

Don't you enjoy dreaming about what you could have on your site and finding the right plugin right away?

Then you will find anything you need on jQuery in this resource list to do whatever you want and become a better jQuery developer. You will find the following materials:

Updated 10/21 with 1 (Awesome) Way To Avoid the (Not So Excellent) Flash of (Amazing) Unstyled Content » Learning jQuery - Tutorials and Information.

Updated 10/07 with Dynamically Adding File Upload Fields To A Form Using jQuery.

Updated 09/22 with a jQuery Context Menu.

Updated 09/15 with a tabbed interface navigational area.

Updated 09/10 with jCrop, an image cropping plugin for jQuery.

• Getting Started: introductions to jQuery from a very basic level
• Tutorials: learn how to do simple and advanced things to your websites
• Most Useful Plugins: use existing solutions to your problems with UI, images, forms, etc
• Lists: mine other lists for overlooked items
• For Designers: find just what a designer needs from jQuery
• Cheatsheets: download jQuery cheatsheets to code easily
• Blogs: subscribe to people, writing about jQuery
• Books: read the books to become a jQuery guru
• Notable Links: check out interesting links about jQuery

Getting Started

If you are new to jQuery, you should be able to grasp the basics from these excellent introductions:

1. How jQuery Works

   A basic introduction to jQuery from jQuery.com.

2. Getting Started with jQuery

   The tutorial on getting started with jQuery from jQuery.com.

3. Introduction to jQuery UI

   A brief introduction to the UI of jQuery 1.5.

4. 15 Resources To Get You Started With jQuery From Scratch

   Essential resources to get started with jQuery.

5. jQuery Crash Course

   A quick to action introduction to jQuery for experienced web developers.

6. New Screencast: Intro to jQuery

   A screencast that can introduce you to jQuery.

7. Learning jQuery in 30 minutes

   A slideshow that lets you learn jQuery in 30 minutes (at Slideshare).

8. jQuery in 15 Minutes

   A slideshow, to introduce you to jQuery in 15 minutes at Slideshare.

9. jQuery For Absolute Beginners

   A screencast for absolute beginners in jQuery.

10. Introducing jQuery: Javascript Library

    A detailed introduction to jQuery with how to examples.

11. jQuery From Scratch: A Beginner's Guide

    An introductory guide for real beginners (part 1)

12. jQuery From Scratch: Functions

    The tutorial explains how to write and execute functions (part 2 of the previous one).

13. jQuery Documentation in .chm (found it thanks to Ozh, initially here)

    jQuery API browser as chm (150 Kb)

    jQuery documentation Wiki as .chm: jQuery and jQuery UI Reference 1.2.chm (639 Kb)

jQuery Tutorials: How to Do Stuff

Learn how to put your web dreams into reality with jQuery.

14. Using jQuery with Other Libraries

    Learn how to use jQuery with other libraries without conflicts.

15. How to tell if jQuery is out of date

    A brief hack that let's you instantly see, whether your jQuery is out of date in Firefox with Firebug.

16. Building Your First jQuery Plugin

    A plain simple guide to building your own first jQuery plugin.

17. Submit A Form Without Page Refresh using jQuery

    An excellent tutorial on submitting a form without a page refresh with jQuery (the actual email is sent with a php script that processes in the background).

18. Adding Form Validation to WordPress Comments using jQuery

    A very detailed guide on adding form validation to WordPress comments.

19. Create a Tabbed Interface using jQuery

    A very detailed tutorial on creating neat tabs with jQuery (example)

20. Developing an Accessible Slider with jQuery

    Building accessible pages can be a pain, so it is useful (both to your visitors and you) to know how to build an accessible slider.

21. Learning jQuery: Revealing Photo Slider

    A useful showcase of using jQuery to display a larger photo on a click.

22. Deep Profiling of jQuery Apps

    Get a plugin to see what your jQuery code does and how performance breaks down method by method.

23. MaxSide: jQuery Plugin (and How-To)

    A tutorial to create a plugin to resize an image according to the value you set to its largest size.

24. Learning jQuery: Revealing Photo Slider

    A demo with jQuery code to show more of an image on click.

25. Auto-populating Select Boxes using jQuery & AJAX

    Learn how to select a category and autopopulate subcategories with jQuery.

26. Easy Fading Using jQuery

    Show only images of a ceratin selected type with fading.

27. jQuery Content Slider Tutorial

    A simple explanation of building a content slider.

28. Flashing Alert Message Box using JQuery

    Show a sliding and animated alert message.

29. Building better web forms: Context highlighting using jQuery

    Highlight the current form field with jQuery.

30. Using jQuery to Save Form Details

    Save form details to make your forms more friendly to your visitors (and increase sign-ups).

31. jQuery: Animation for Dummies

    Learn a simple and an advanced ways of creating animation with jQuery.

32. Live Examples of jQuery

    See live examples of jQuery and their code immediately.

33. Text Resizing With jQuery

    A simple guide on allowing your visitors to increase or decrease font size on web pages.

34. How to build search into your site with JQuery and Yahoo!

    Build your site search with jQuery and Yahoo.

35. Color Palette Generator with jQuery

    See what colors the page has with a single mouse click. Learn how.

36. Create a Tabbed Navigation Area With CSS and jQuery

    Learn how to create a neat tab navigation with CSS and jQuery.

37. Dynamically Adding File Upload Fields To A Form Using jQuery

    A tutorial and code you can useto add file upload files to forms with jQuery.

38. 1 (Awesome) Way To Avoid the (Not So Excellent) Flash of (Amazing) Unstyled Content » Learning jQuery - Tutorials and Information

    A tutorial to easily use jQuery to solve a nagging problem we sometimes have.

Tutorials from 15 Days of jQuery

39. Quicker Than Window.Onload()

    Load your Javascript before every element of the page is loaded.

40. Table Striping Made Easy

    A tutorial on how to create stripes in your tables for mouseover.

41. Affiliate Link Loveliness

    How to hide affiliate links with jQuery easily.

42. Safer Mailto Links

    Enjoy using mailto links without spamming.

43. Wrap It Up: Lazy Man's HTML Generation with jQuery

    Instead of using div containers yourself, do it with jQuery.

44. Safer Contact Forms Without CAPTCHA's

    Use a hidden field in a form and don't annoy your visitors with CAPTCHA.

45. Stylesheet Switcheroo

    An easy way to switch stylesheets with jQuery.

46. Rounded Corners with Javascript (jQuery)

    Two eays to create rounded corners with jQuery: with and without images.

47. Quick and Dirty AJAX with jQuery

    The video discusses more complex aspects of using jQuery and AJAX.

48. Edit In Place with AJAX Using jQuery Javascript Library

    Edit a page without refreshing it.

49. Multiple File Upload Magic With Unobtrusive Javascript

    Two ways to upload multiple files: one general code, another accessible unobtrusive jQuery code.

50. jQuery Lightbox

    Display images in a thickbox.

51. Accessible Unobtrusive Javascript Tabs

    Accessible Javascript tabs with a tool to create XHTML.

52. Javascript Tooltips on Steroids

    Very detailed tooltips with Javascript.

jQuery Tutorials from Detached Designs

Jeffrey has written and put together quite a number of tutorials on jQuery, they are worth checking out.

53. Five jQuery Questions and Answers

    Learn answers to the following questions:

    • How Can I Target All Links That Contain An Attribute With A Specific Value?
    • What Is The Difference Between Using The "*", "$", and "^" symbol in my jQuery select statements?
    • How Can I Style Alternating Rows In My Table Or List?
    • How Can I Hide and Show A Form?
    • Where Can I Learn More About jQuery
54. 5 More jQuery Questions...And Answers

    Learn answers and get instructions on 4 more questions:

    • How Can I Increase and Decrease The Text With jQuery?
    • How Can I Zoom An Image When It Is Clicked?
    • How Can I create A "Read More" Link That Will Instantly Expand To Show The User Additional Text When Clicked?
    • How Can I Shift An Image A Specific Number Of Pixels Every Time It Is Clicked?
55. Learning About The Animation Abilities Of jQuery

    A complete guide to animation with jQuery.

56. Load Data From Other Pages With jQuery

    A simple how to on using data from other pages.

57. Advanced Image Enlargement With jQuery

    An advanced tutorial on showing large images from a page with a thumbnail.

58. How To Load Data From A Text File

    See how to get the data from a .txt file.

59. How Can I Vertically Center An Element?

    A video tutorial on centering an element vertically.

60. How Can I Track The Position Of The User's Mouse With jQuery?

    An example of dead simple code to track mouse movement with jQuery.

61. Select Anything With jQuery

    Learn how to select anything with jQuery from this video tutorial.

62. CSS Developer - Why Aren't You Using JQuery?

    An introductory tutorial for CSS designers, showing how to easily create a fade in div and rounded corners in 60 seconds.

63. Why Aren't You Using jQuery: PART 2

    A tutorial showing how to create a CSS menu with jQuery (with a follow up on bug fixes for it).

64. Why Aren't You Using jQuery: PART 3

    A tutorial, showing how to create a pretty neat Flash-like image gallery.

65. Dynamically Switch Layouts Using jQuery

    Bringing up the memories of CSS style switchers, this tutorial will teach you how to change page layouts on the fly, depending on whatever you consider important (amount of columns, window size, etc).

Tutorials for jQuery and ASP.NET

If you are an ASP.NET developer, then you'll get these jQuery how tos.

66. Using jQuery to directly call ASP.NET AJAX page methods

    Use jQuery to call a page method without using the ScriptManager (get the full code from this tutorial, though).

67. Getting jQuery Goodness into ASP.NET AJAX

    If you don't want to switch to or use jQuery at ASP.NET, consider this tutorial on doing the same with ASP.NET AJAX.

68. Getting jQuery Goodness into ASP.NET AJAX - Take II

    A second tutorial on getting jQuery from ASP.NET AJAX.

69. Use jQuery and ASP.NET AJAX to build a client side Repeater

    A how to on using several steps to leaving processing to the client, while only sending the data.

70. jQuery (using Galleria) with the File System

    How to create an image gallery with ASP.NET 3.5 and jQuery.

71. Dynamically create ASP.NET user control using JQuery and JSON enabled Ajax Web Service

    A detailed tutorial on creating ASP.NET user control using jQuery (based on an ASP.NET AJAX tutorial)

Most Useful jQuery Plugins

You might find these hand-picked jQuery plugins to create inspirational websites.

72. jQchart: jQuery Plugin

    A simple draggable AJAX chart with jQuery on Canvas

    

73. jQuery Ajax Manager

    Manage AJAX requests with jQuery.

74. jSmile - jQuery Plugin

    Show smilies in a document.

    

75. jQuery calculate plugin

    Calculate total values from any HTML elements.

    

76. Gradient : jQuery Plugin

    Create a gradient with jQuery.

    

77. jQuery.Accessible

    Shows which elements are inaccessible and why.

    

78. TableEditor

    Edit tables from the page without diving into HTML.

    

79. jQuery Media Plugin

    A plugin to embed all kinds of media in your site.

    

80. Style Author Comments Differently with jQuery

    Highlight your blog comments in comments to make them more noticeable.

    

81. Round Corners Plugin

    Create rounded and other types of corners without images.

    
    

82. JQuery Curvy Corners

    Anti-aliased round corners.

    

83. Tooltip Plugin

    An extensive tooltips plugin for jQuery (have text, images as tooltips)

    

84. jQuery Popup Bubbles

    Cute tooltip bubbles with jQuery.

    

85. Lavalamp jQuery plugin

    Brilliant visual effects with a dash of jQuery with with alternative Lavalamp examples.

    
    

86. jQuery Color Picker

    Easily pick colors with jQuery.

    

87. Farbtastic: jQuery color picker plug-in

    Another color picker plugin for jQuery.

    

88. Numeric DLs jQuery Plugin

    Ever had a problem of numbering definition lists? Solve it with this plugin (as you might've noticed, I decided to go with <ol>, though)

89. jQuery external link favicons plugin

    Display favicons of sites you link to near the links.

    

90. jQuery Spy

    See what is happening on your site with exact timestamps.

91. Lazyload

    Load images, when the visitor scrolls to them (opposite to preloading).

92. jGrowl

    A jQuery plugin providing similar messaging as Growl in OS X.

UI with jQuery

93. jQuery UI (examples, docs)

    Create any kind of user interaction and other elements.

94. BlockUI Plugin

    Simulate synchronous ajax by blocking - not locking - the UI.

95. jQuery Sparklines

    A plugin to create small inline charts (sparklines) from data input.

96. jSocialize -bookmark widget

    Show many social bookmarking buttons with jQuery.

    

97. prettyComments, a solution to comment boxes

    Expand the size of your comments as necessary (works in most major browsers).

    

98. NyroModal :: jQuery Plugin

    Show a gallery, image, data in a modal page without refreshing the entire page with this customizable plugin.

99. Flexigrid for jQuery

    A lightweight, but extensive data grid with columns and scrolling.

    

100. Ingrid

     Transform a table into a datagrid with column resizing, paging, sorting, row and column styling, etc.

     

101. Tablesorter

     A neat table layout with sorting, using jQuery, with lots of customization.

     

102. Creating accessible charts using canvas and jQuery

     Create accessible charts with jQuery.

103. Damn Small Rich Text Editor

     Create a rich text editor with jQuery.

     

104. jWYSIWYG

     A simple WYSIWYG text editor on jQuery.

     

105. UI Datepicker

     An easy calendar-like interface for picking a date.

     

106. jTabber

     Click on tabs, see different content without reloading the page.

     

107. jQuery Accordion Menu

     A jQuery accordion site menu plugin.

     

108. Zebra jQuery plugin

     Color odd and even rows with different colors and highlight a row on hover.

109. Mark-It-Up

     Turn any textarea into a markup editor: HTML, Wiki Syntax, BBcode: you name it (examples).

110. Superfish (examples)

     Suckerfish nav menu improved with jQuery.

     

111. jQuery Live Ajax Search Plug-in (example)

     Create a search button that shows results once you start typing.

     

112. jRails

     Get the same UI effects with jRails: a jQuery replacement for Prototype/script.alicio.us on Rails.

113. jQuery Context Menu Plugin

     Create a neat right-click context menu with jQuery. Doesn't override the Opera 9.5 menu, which hides it, however. See the demo.

Lightbox

114. Lightbox

     An easy to use an unobtrusive script to overlay an image or a gallery over a page without refreshing it.

     

115. Facebox

     A Facebook like window to display images, divs or entire pages.

     

116. Lytebox

     A mod to the original Lightbox, featuring a slideshow and performance improvements, support for themes and HTML content.

     

117. LightWindow (examples)

     Embed and create galleries from anything: images, movies, Flash, websites, etc.

     

Handle Images with jQuery Plugins

118. jCrop

     Probably the best image cropping plugin for jQuery. It has a manual, too.

     

119. jQuery Crop

     Crop images to the specified height and width sizes.

120. jQuery image upload and crop

     Upload images and crop them with jQuery.

     

121. jQuery Image Zoom Plug-in (example)

     Zoom into images with about 90 lines of code (example).

122. jQZoom

     Zoom in the images without losing sight of the rest and without opening a new page.

     

Create Image Galleries with jQuery Plugins

123. jQuery 3D Image Carousel

     This time, a 3D image gallery with jQuery.

     

124. A Space Gallery jQuery Plugin

     A plugin to create a space-like image gallery.

     

125. jQuery Slider Gallery

     Show your products in a slider, similar to that on the Apple website.

     

126. Step Carousel Viewer

     A gallery where you scroll images from side to side by clicking on a button/link that scrolls the gallery by one or several images or gets you to the first one.

     

127. Image Strip

     Show an image gallery in a peculiar interface.

     

128. jCarousel

     A cute, customizable image carousel with jQuery.

     

Improve Web Forms with jQuery Plugins

129. Auto-populate multiple select boxes

     A plugin to autopopulate select boxes.

     

130. prettyCheckboxes

     Create pretty checkboxes for your forms.

     

131. Justify elements using jQuery

     A simple way to justify elements in web forms with jQuery.

     

132. jQuery Form Input Plugin

     Enter disappearing sample text into any form field with jQuery.

     

133. jQuery-Autotab

     Auto tab to a next field upon filling the current one.

     

134. jQuery-Context highlighting

     Highlight active fields in web forms with jQuery.

     

135. Simple Chained Combobox Plugin for jQuery

     Create a web form with dependable select fields easily with jQuery.

     

136. Autosuggest search engine

     Suggest form field values the Facebook way.

     

137. jNice

     A plugin to make your form look nice.

     

138. Live form-validation jQuery plug-in

     Validate forms with jQuery on the fly.

139. Alphanumeric

     Filter the data site visitors put in form fields.

140. labelOver

     Display the form label inside the form field until the visitor starts filling it.

     

141. Autosave

     Solve your visitors' problems by saving the data from their fields.

142. Ajax Username Check - Using JQuery!

     Check, whether a username is available, with jQuery.

     

jQuery Lists

143. Tutorials at jQuery.com

     A list of tutorials at the jQuery.com website.

144. 15 Resources to Get You Started with jQuery from Scratch

     A list of sites you can learn jQuery to get started.

145. 50+ Amazing jQuery Examples- Part1

     A great list of examples on the use of jQuery.

146. 37 More Shocking jQuery Plugins

     A list of 37 more plugins you can use.

147. 45 Fresh out of the Oven jQuery Plugins

     As if you don't have enough jQuery plugins, you can get 45 more from this list.

148. jQuery Plugins at jQuery.com

     A huge database of plugins at jQuery project.

149. The Ultimate jQuery Plugin List

     A list (of about 100) jQuery plugins for all situations: file upload, forms, time/date pickers, search, rating, inline edit, photo, media, tables, etc.

150. AJAX Rain jQuery Directory

     320+ jQuery plugins for all occasions in a plugin directory (along with other goodies).

151. 240 jQuery plugins

     A list of 240 jQuery plugins without descriptions or screenshots, just categorized names and links.

     jQuery for Designers

     If you are the design person, feel free to check these jQuery links.

152. jQuery For Designers

     An introduction of jQuery to web designers with how tos on doing simple things.

153. jQuery for Designers

     A blog, dedicated to showing designers "how easy it is to apply web interaction with jQuery".

154. jQuery Tutorials for Designers

     10 basic visual tutorials for jQuery.

155. 8 Fantastic jQuery Tutorials for Designers

     8 more tutorials for achieving visual bliss with jQuery.

jQuery Cheatsheets

156. A jQuery 1.2 Cheatsheet

     A cheatsheet for jQuery 1.2 that comes in PDF (PDF).

157. jQuery Cheatsheet

     A cheatsheet for iPhone, iPod and in .png.

158. jQuery Selectors

     A cheatsheet for jQuery from Dzone.

159. Visual jQuery

     A visual jQuery 1.2 cheatsheet: consult the detailed descriptions of functions on one page. Thanks to Stanley from Hacker News for reminding me about it.

160. jQuery API

     Online reference for jQuery.

Blogs

161. The Official jQuery Blog

     The official blog of jQuery to stay up to date with the news, updates and the like.

162. Learning jQuery

     Read this blog and get to know the library of choice for unobtrusive JavaScript (yes, jQuery).

163. jQuery at Detached Designs

     Weekly useful tips on developing with jQuery.

164. jQuery for Designers

     A blog, covering easy web interaction with jQuery.

165. Karl Swedberg's Amazon Blog

     A blog by one of the "Learning jQuery" authors on Amazon.

166. Web Tool Kit 4 Me

     While the blog focuses on many cool web programming goodies, it also covers some jQuery.

Books

167. jQuery in Action

     A book, written by jQuery pros, to guide you from the beginning to advanced development.

168. Learning jQuery: Better Interaction Design and Web Development with Simple JavaScript Techniques

     The book offers an introduction to building interactive designs and great user interfaces for your websites.

169. jQuery Reference Guide

     An extensive reference guide to jQuery covering everything from functions to plugins.

Other Notable Stuff

170. AJAX Libs

     Load jQuery and jQuery UI directly from Google CDN to speed up your sites.

171. flot: Attractive Javascript plotting for jQuery

     A Javascript plotting library for jQuery, allowing you to graph things, read the tutorial.

172. jQuery Effects

     A view on jQuery by someone, who worships Dojo.

173. jQuery Visual Map

     A visual map of jQuery: base, effects, plugins and AJAX.

174. Adobe Air App (zip)

     Browse jQuery docs offline.

175. XML file for jQuery Docs

     You can also use the XML file of the jQuery documentation located at an SVN repository hosted at googlecode.com.

176. ThemeRoller

     Select your styles and download your theme from a jQuery UI.

177. Writing Better jQuery Code

     Learn how to write better jQuery code to save your time and enjoy the process.

Add this post to del.icio.us

Feel free to share the URL, thanks:
http://cli.gs/LuPLW9