What Will I Learn?
- How to tap into the vast resources of jQuery
- How to do more work while writing less code
- How to use jQuery to make your website dynamic
In this jQuery tutorial you will learn - among other things - how to create jQuery effects, jQuery events and event handlers. That is, you will learn how to use jQuery to write less code and in doing so - save time. And there is nothing more precious than time for a developer. The quicker you code, the better you are at your job. In this case time is literally money. This jQuery tutorial takes this fact very seriously. jQuery is a tool and you must learn how to use it according to its purpose. That is why the very first lecture in this jQuery tutorial teaches you how to write three lines of code instead of twelve.
A jQuery Tutorial Adjusted for Beginners
To start this jQuery tutorial you don’t need to have any experience in using jQuery code. You do not need to know anything about jQuery, because you will learn it all - what are jQuery effects, how do jQuery events work, how to use jQuery to build a dynamic website. This tutorial is the place to learn jQuery for beginners.
Keep in mind, that there is nothing wrong about being a beginner. Everyone is a beginner at something, it is the most natural state in the Universe. However, a smart beginner does the research and finds the best place to start learning. Well, you already did.
How to Use jQuery? Step One, Start Using It
If you want to learn how to use jQuery, you should avoid theory as much as possible. jQuery is a web development tool and so it is best learned in an interactive way - by building a website. This jQuery tutorial offers you to do just that. Adding one jQuery effect to another, making mistakes and learning from them, you will build a TIME Watch site - an online marketplace for hip watches - and you will get first-hand knowledge on how jQuery works.
Even though each lecture will start with a pinch of theory to familiarize you with a core concept of jQuery, you won’t have to read more text than is absolutely necessary. For example, in every lecture you will read a sentence or two about one of the jQuery events and examine an example of the code. Then you will have to perform a task to add more and more features to the TIME Watch website. If you get stuck on a task, you will be provided with the solution, which will help you improve. Don’t worry, learning how to use jQuery won’t ever feel like a chore, not in this jQuery tutorial.
Why Learning jQuery Effects and jQuery Events Matter
In addition, jQuery is already a time-tested tool. It is a library of premade code that actually works and improves the life of a developer. jQuery is not a passing fad that will disappear like many other libraries, but a useful set of skills to master.
Just Try the First Lecture and You'll See How Easy It Is
Start with this jQuery tutorial. If you are looking for the best place to learn jQuery for beginners, you do not need to look any further. Just take the first lecture and before long you will be writing jQuery effects and jQuery events like a pro.
- A PC or Mac is required. Mobile not supported yet.
- No special software is required in advance of the course.
Section 1: Introduction to jQuery
- Lecture 1: The benefits of jQuery
- Lecture 2: jQuery Methods
- Lecture 3: jQuery Library
- Lecture 4: Adding jQuery
- Lecture 5: .ready()
- Lecture 6: Targeting by Class
- Lecture 7: Targeting by id
- Lecture 8: jQuery Objects
- Lecture 9: Event Handlers
- Lecture 10: Review: jQuery Introduction
Section 2: jQuery Effects
- Lecture 1: Introduction
- Lecture 2: .hide()
- Lecture 3: .show()
- Lecture 4: .toggle()
- Lecture 5: fadding
- Lecture 6: .fadeToggle()
- Lecture 7: Sliding
- Lecture 8: Summary
Section 3: jQuery Event Handlers
- Lecture 1: Introduction to Mouse Events
- Lecture 2: On 'mouseenter'
- Lecture 3: On 'mouseleave'
- Lecture 4: Chaining Events
- Lecture 5: currentTarget
- Lecture 6: Review: Mouse Events
Section 4: jQuery Style Methods
- Lecture 1: CSS & jQuery
- Lecture 2: .css()
- Lecture 3: .css() II
- Lecture 4: .animate()
- Lecture 5: .addClass()
- Lecture 6: .removeClass()
- Lecture 7: .toggleClass()
- Lecture 8: Review: Style Methods
Section 5: jQuery DOM navigation
- Lecture 1: The DOM tree
- Lecture 2: Children
- Lecture 3: Parent and Siblings
- Lecture 4: Closest
- Lecture 5: Next
- Lecture 6: find
- Lecture 7: DOM summary