Advertisement
Web Roundups

jQuery for Absolute Beginners: The Complete Series

by

Hi everyone! Today, I posted the final screencast in my "jQuery for Absolute Beginners" series on the ThemeForest Blog. If you're unfamiliar - over the course of about a month, I posted fifteen video tutorials that teach you EXACTLY how to use the jQuery library. We start by downloading the library and eventually work our way up to creating an AJAX style-switcher. I'm very proud of this series; possibly more than any other that I've done for Envato.

  • jQuery for Absolute Beginners

    Day 1

    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.

    Visit Article

  • jQuery for Absolute Beginners

    Day 2

    Continuing from yesterday, today we’ll take a look at the “fadeIn”, “slideDown”, and “show” methods. We’ll also examine jQuery’s “css” abilities.

    Visit Article

  • jQuery for Absolute Beginners

    Day 3

    Today, we’ll take a look at the animate method, and a few “gotchas” that come along with it. You’ll learn how to shift any element across the screen.

    Visit Article

  • jQuery for Absolute Beginners

    Day 4

    Consider an unordered list filled with ten or so list-items. In this video, I’ll show you exactly how to individually select each one of them. We’ll be using advanced selectors, including a touch of X-Path.

    Visit Article

  • jQuery for Absolute Beginners

    Day 5

    Today, we’re going to learn how to dynamically create and remove elements. The “appendTo()”, “size()”, and “remove()” methods will be reviewed. As always, feel free to ask any questions that you might have. Enjoy!

    Visit Article

  • jQuery for Absolute Beginners

    Day 6

    It’s day six. We’re going to take a look at the toggle() and toggleClass() methods and how they can be used to essentially turn “off and on” elements or classes.

    Visit Article

  • jQuery for Absolute Beginners

    Day 7

    Today, we’re going to take a look at the hover() method. This will allow us to write code for when a user mouses on and off the elements in a wrapped set. We’ll also take another quick look at animating elements.

    Visit Article

  • jQuery for Absolute Beginners

    Day 8

    At the request of one of our viewers, I’ll show you how to mimic the image functionality seen here. Though, at first glance, it might appear to be difficult, don’t worry! It’s actually quite simple. I’ll show you how.

    Visit Article

  • jQuery for Absolute Beginners

    Day 9

    In today’s video tutorial, I’ll show you how to resize text every time an associated anchor tag is clicked. We’ll be examining the “slice”, “parseFloat”, and “CSS” Javascript/jQuery methods.

    Visit Article

    View Demo

  • jQuery for Absolute Beginners

    Day 10

    "It’s time to start digging into jQuery AJAX capabilities. Today, we’ll start off as simply as we can. We’ll store information on one page, and then load that specific information from another page! We’ll accomplish this by using jQuery “load()” method."

    Visit Article

    View Demo

  • jQuery for Absolute Beginners

    Day 11

    "Have you ever hovered over an image and seen a larger version pop up that moves parallel to your mouse movement? I’ll show you how to mimic that functionality today! "

    Visit Article

    View Demo

  • jQuery for Absolute Beginners

    Day 12

    "Today will be the first part of a 2-part series. Ultimately, we’ll be drawing information from a database to create an advanced tooltip. Today, we’ll start with the layout and the basic functionality. It shouldn’t be too different from what we did in Day 11. In Part 2, we’ll use jQuery to call a PHP method asynchronously, and then populate the tooltip."

    Visit Article

    View Demo

  • jQuery for Absolute Beginners

    Day 13

    "Today, I’m going to show you how to submit information to a database asynchronously - using PHP and jQuery. We’ll be primarily working with the $.ajax method. "

    Visit Article

  • jQuery for Absolute Beginners

    Day 14

    "Today, I’ll show you how to implement a jQuery plugin into your applications. There are literally hundreds of third party plugins available. It would be silly to ignore them! As you’ll find, they’re quite easy to implement! I’ve chosen the s3Slider plugin."

    Visit Article

    View Demo

  • jQuery for Absolute Beginners

    Day 15: Part 1

    "Today’s screencast is a bit misleading! Over the course of the next two tutorials, we’ll be creating a jQuery style-switcher that will allow the user to switch between CSS files. However, today we’re only going to be working with PHP! Day 15: Part 2 will cover the jQuery."

    Visit Article

    View Demo

  • jQuery for Absolute Beginners

    Day 15: Part 2

    In Part 1 of day fifteen, we worked on setting up the PHP side of a CSS style-switcher. Today, we’re going to take things one step further and implement some AJAX functionality. Coming in at just under thirty minutes, this final video in the series is the most in depth.

    Visit Article

    View Demo

Related Posts
  • Web Design
    Typography
    Getting the Hang of Hanging PunctuationGrand motel text effect
    Hanging Punctuation is a powerful typographic tool for creating optically aligned bodies of text. Unfortunately, it has been largely forgotten on the web... until now. We’ll take a look at the value of hanging punctuation and how you can partially implement it using a little JavaScript and a CSS rule which has been around for years.Read More…
  • Code
    Theme Development
    Creating a WordPress Theme from Static HTML: Creating an Archive TemplateCreating wordpress theme from html 400
    If you've been working your way through this series, you now have a functioning theme with two page templates. The steps I've demonstrated to this point are: preparing your markup for WordPress converting your HTML to PHP and splitting your file into template files editing the stylesheet and uploading your theme to WordPress adding a loop to your index file adding meta tags, the wp_head hook and the site title and description to your header file adding a navigation menu adding widget areas to the header and sidebar adding widget areas, a colophon and the wp_footer hook to the footer file creating template files for static pages. Read More…
  • Code
    Tools & Tips
    Tips to Avoid Brittle UI TestsUi test retina preview
    In the last article I talked about a few ideas and patterns, like the Page Object pattern, that help write maintainable UI tests. In this article we are going to discuss a few advanced topics that could help you write more robust tests, and troubleshoot them when they fail:Read More…
  • Code
    PhoneGap
    PhoneGap: Build a Feed Reader - Project StructurePhonegap feed reader@2x
    Although not specifically created to work together, jQuery Mobile and Cordova (also known as PhoneGap) are a very powerful duo to create hybrid, mobile apps. This series will teach you how to develop a feed reader using web technologies and these two frameworks. Over the course of this series, you'll also become familiar with the Cordova Connection and Storage Core Plugins and the Google Feed API.Read More…
  • Code
    jQuery
    The State of jQuery in 2013Code
    A long time ago, in a galaxy far, far away, JavaScript was a hated language. In fact, “hated” is an understatement; JavaScript was a despised language. Consequently, developers generally treated it as such, only tipping their toes into the JavaScript waters when they needed to sprinkle a bit of flair into their applications. Some form validation here, an image slider there. Despite the fact that there is a whole lot of good in the JavaScript language, due to widespread ignorance, few took the time to properly learn it.Read More…
  • Code
    News
    The First Ever Tuts+ Premium Sale (Last Chance!)Tuts premium sale
    Those of you who help support the Tuts+ network by becoming Premium members will be well aware of the improvements that we've made in the last year, including a full redesign, in depth screencast courses on the technologies that you most want to learn, and eBook partnerships with Smashing Magazine and Packt Publishing. To celebrate the new year, we’re offering a sale on our subscription for the very first time! Update: January 31st is the last day to take advantage of this deal!Read More…