30 jQuery Tutorials for Complete Beginners

jQuery (a friendly JavaScript library) seems to be substatially popular among programmers, and even non-programmers. It’s capability to add more visual appeal and dynamic solutions to websites makes it ideal for all webmasters.

I haven’t been able to continue the jQuery tutorials on Webitect at a pace I originally would’ve liked to, so I’m going to share 30 jQuery tutorials that are easy to follow, and most of which have helped me get started. First, let’s do a quick review on what jQuery is, for those who are unaware.

What is jQuery?

“jQuery is simply, a new JavaScript library. It is lightweight, and focuses mainly on the interaction between HTML and JavaScript. Thus, it is great for webmasters. Just like JavaScript itself, jQuery can make any website more dynamic, and add a lot of professionalism and usability. It can do most things Flash can do, without the extra work. As another benefit, jQuery is also SEO (Search Engine Optimization) friendly, unlike Flash.” – jQuery Tutorial: Part I

With that being said, here are the 30 useful jQuery tutorials for absolute beginners:

Webitect

Here are the tutorials for learning jQuery for a beginner’s approach. I try to write tutorials at the most basic level, so they can be useful for anyone who has had trouble getting started.

1. jQuery Tutorial: Part I

2. jQuery Tutorial: Part II: Cascading Menu

3. jQuery Tutorial: Part III: Parameters

Theme Forest Blog

A great series of screencasts for jQuery beginners. These are a very detailed and visual approach to learning jQuery.

4. jQuery for Absolute Beginners: Downloading the Library

5. jQuery for Absolute Beginners : Fade, Slide, and Show Methods

6. jQuery for Absolute Beginners: The animate method

7. jQuery for Absolute Beginners: Advanced Selectors

8. jQuery for Absolute Beginners: Creating and Removing Elements

9. jQuery for Absolute Beginners: The toggle() and toggleClass() Methods

10. jQuery for Absolute Beginners: The hover() Methods

11. jQuery for Absolute Beginners: Image Slides

12. jQuery for Absolute Beginners: Resizing Text

13. jQuery for Absolute Beginners: Intro to AJAX: Using the Load Method

14. jQuery for Absolute Beginners: Fun Image Hovering

15. jQuery for Absolute Beginners: Advanced Tooltips: Part I

16. jQuery for Absolute Beginners: Submitting Information to a Database Asynchronously

17. jQuery for Absolute Beginners: Implementing your First Plugin

18. jQuery for Absolute Beginners: Building a jQuery Style-Switcher

19. jQuery for Absolute Beginners: Building a jQuery Style-Switcher: P. 2

Learning jQuery .com

A set of tutorial posts for learning jQuery that are incredibly easy to follow. Some are specific tutorials that are interesting tricks, and others are the nitty gritty behind coding in jQuery.

20. Working with Events: Part 1

21. Working with Events: Part 2

22. Quick Tip: Dynamically add an icon for external links

23. Revealing Details with jQuery

jQuery Documentation

Some beginner tutorials by John Resig himself (the creator of the jQuery library).

24. How jQuery Works

25. Getting Started with jQuery

26. jQuery for Designers

CSS-Tricks.com

Another approach for beginners to jQuery. Very introductory tutorials that may have been covered over and over again, but very easy to understand for anyone who may not quite understand the others yet.


27. Introduction to jQuery: Installation and Beginning to use jQuery

28. Introduction to jQuery: Part 2

29. Simple jQuery Dropdowns

30. Revealing Photo Slider

Please share your own tutorials!

If you have any tutorials you’ve written or have found concerning JavaScript or jQuery, please share them with us!

Written By Kayla

Kayla Knight is a 20 year old college student, part-time web developer, freelancer, and blogger. Webitect is where she spends too much of her freetime, sharing interesting finds and valuable resources. Be sure to check out her portfolio.

8 Comments

  1. Jumana

    May 5th, 2009 at 11:43 am

    awesome!
    I’ll have to take a better look at these later! XD
    thanks!

  2. faye

    May 5th, 2009 at 04:32 pm

    Ive heard of jQuery before, but ive never thought about using it before! Maybe its something I should check out! xD

  3. April

    May 7th, 2009 at 04:40 am

    So that is jQuery? Cool. If I am only a CS student surely those would be so helpful. But nevertheless I will still manage to learn even just a bit of this.