Skip to main content

10 Exclusive JavaScript and jQuery Tutorials Of 2011

By Sam Deering



Free JavaScript Book!

Write powerful, clean and maintainable JavaScript.

RRP $11.95

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.

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.

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.

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.

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.

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.

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.

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.

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.

10. Spotlight: Constrained Stickies with jQuery

Learn PHP for free!

Make the leap into server-side programming with a comprehensive cover of PHP & MySQL.

Normally RRP $11.95 Yours absolutely free

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.

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

New books out now!

Learn valuable skills with a practical introduction to Python programming!

Give yourself more options and write higher quality CSS with CSS Optimization Basics.