20++ jQuery Introduction Tutorials and Resources for Beginners

Written by Kevin Liew on 08 Dec 2009
87,084 Views • Javascript


jQuery is an amazing Javascript library that makes it easy to create wonderful and astonishing web effect in just a few lines of code. I used to hate javascript a lot because of its long syntax and they are hard to remember. And then I discovered jQuery last year and it got my attention because of its simplicity. It changes the way we code javascript and makes everything so simple to achieve. For example, those fading, sliding animation, one would spent hours to write a function for that, but with jQuery, you just have to call the method! It saves times, cross browsers support, and its robustness simply blow me away.

I have tasted the sweetness of jQuery, so I started this webblog so that I would be able to share what I have been learnt about jQuery.

  • New to jQuery? Don’t be Scurred…

    I have been getting familiar with jQuery recently and the more I get into it, the more I’m impressed with it. When I first heard about jQuery I was definitely intimidated by it since I had no previous background with javascript, but I soon realized once you get the basics down its not very hard to pull of some neat effects.
  • jQuery for Absolute Beginners Video Series

    So everywhere you look, you see “jQuery this” and “jQuery that”. For the last year or so, this library has been the darling of the Javascript world. But do you feel that you just can’t seem to learn the dang thing? Do you hate how the existing tutorials assume that you know WAY more than you actually do? If this rings true for you, I can help.
  • jQuery in 15 minutes

    This is a jQuery Tutorial Slideshow with brief introduction. It presents the most commonly used features of jQuery for javascript developers who have never used it before.
  • Tutorial: Live Examples of jQuery

    An interactive demonstration of the basics behind jQuery from Offical jQuery website.
  • How jQuery Works

    basic introduction to jQuery and the concepts that you need to know to use it from Offical jQuery Website.
  • jQuery From Scratch: A Beginner's Guide

    So what exactly is jQuery? jQuery is a concise JavaScript library. The developers state that jQuery aims to change the way we write JavaScript. I like to think of jQuery as a tool that allows us to simplify JavaScript code. This “Getting Started Guide” is intended as a quick introduction to jQuery - mainly for website designers.
  • Simple Guide: How To Get Started With jQuery

    How can it make my life easier as a developer? How do I get started? Well, jQuery makes writing Javascript fun again and really allows you to take advantage of some of the more difficult aspects of Javascript with relative ease. Today, we will have a look at how to get started with jQuery, and writing your first script!
  • jQuery for Beginners: Selectors, Hierarchies and Attributes, Oh My!

    This is the first part of a series of jQuery tutorials for designers and web developers.
  • jQUery Tutorial for Designers

    This article contains 10 visual tutorials intended for web designers and newbies on how to apply Javascript effects with jQuery. In case you don’t know about jQuery, it is a "write less, do more" Javascript library. It has many Ajax and Javascript features that allow you to enhance user experience and semantic coding. Since these tutorials are focused on jQuery, I’m not going to get into the details of the CSS.

More resources

If you wish to discover more about jQuery, please check the following website, they have tutorials and articles about jQuery oftenly.

Tutorials from Queness

I started learning jQuery since I started this blog. It has been almost 9 months and it was really a great fun playing around with jQuery to make a website more attractive. I have written over 30 comprehensive jQuery tutorials. All of them are well explained and I hope they will able to help you.

Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

Aqeelzam 13 years ago
Thank you for sharing.Best wishes !
Aqeelzam 13 years ago
Well i love these tutorials much