10 Exclusive JavaScript and jQuery Tutorials Of 2011

This post is a compilation of some of fresh and exclusive JavaScript and jQuery tutorials from the year 2011.

1. Drag Drop Shopping Cart Using JQuery

There are a lot tutorial about creating drag and drop shopping cart, in this post I want to share my version still with JQuery, but the different is this example only shows the code on the client side, which mean all of data are hardcoded on the html, and counting price and total items will be handle by JavaScript.

Source

2. Get Element By ID

Forms are the most frequently used objects on dynamic web pages. There are various controls like textfields, lists etc used on the forms to get input from the user. So once you have got the user input, how do you store the values entered in the controls.

Source

3. Password Strength Meter Tutoria

It is 100% styled by CSS and allows for custom validations. It can be used with effects or without and has an optional text component that changes with each change of state. The text defaults to ‘Poor’, ‘Weak’, ‘Medium’, and ‘Strong’; but it can be changed according to preference or language.

Source

4. Create a Game Character with HTML5 and JavaScript – Part

In Part 1 of this series we will design a game character from scratch. We will start with a drawing on paper and with the help of JavaScript we will create breathing, blinking character on HTML5 canvas. Hopefully by the end of Part 1 you will have the tools and inspiration to create a character of your own.

Source

5. Create Delicious Tag Field using jQuery

Delicious tagging field, not a pure input tag element, it is a div box that contain list box, so when you search this it use the TextListBox keyword, user will see it as input field, but actually it is a div box with ul and li tag.

Source

6. Making a Custom Facebook Wall with jQuery Templates

In this tutorial, we are going to create our own version of Facebook’s wall. We will be using Facebook’s Graph API with jQuery, and the template plugin. The jQuery.tmpl plugin will allow us to define templates within our page, and convert the posts we’ve obtained from the API into a real HTML page.

Source

7. How to Create Preload Images with jQuery in WordPress

In today’s tutorial, we’ll learn how to preload the images with jquery. With this feature your site can enhancing user experience.

Source

8. JQuery Typing Game

This game inspired by an old shark typing game, which is created by pop cap game, but it seems not available anymore.

Source

9. Timer Gallery V2 Ajaxed

This is the newest version of Timer Gallery. In the original plugin, if there were too many images the gallery would break. I corrected this in the new version so that all the large images are loaded into the page instead of living within it.

Source

10. Spotlight: Constrained Stickies with jQuery

Today, we’re going to take a look at a plugin that implements a pretty neat effect — it’s pretty hard to explain in a sentence so you may as well click on the continue button to get started after the jump.

Source