jQuery Tutorials

• jQuery Markup

  jQuery Wookmark

  The first thing that hits you when you visit Pinterest is "Whoa, the columns are the same width and the photos are cut to fit just the way they should."  Basic web users probably think nothing of it but as a developer, I can appreciate the effort that went into creating that design, both on the server and client sides.  That's why I've fallen in love with Wookmark, a jQuery plugin to create the same consistent layout effect with imagery.

  Read Post View Demo

• CSS CSS Animations Firefox OS jQuery Mobile

  Create a Brilliant Sprited, CSS-Powered Firefox Animation

  Mozilla recently formally announced Firefox OS and its partners at Mobile World Congress and I couldn't be more excited.  Firefox OS is going to change the lives of people in developing countries, hopefully making a name for itself in the US as well.  The partners website also  launched with an awesome Firefox animation that I couldn't pass up the opportunity to write about — let me show you how it was created!

  Read Post View Demo

• CSS CSS Animations jQuery Markup

  Build a Street Fighter Demo with CSS Animations and JavaScript

  I recently learned a cool technique from Simurai about how to animate PNG sprites with the CSS3 animations' steps() property. The main idea in this technique is to "recreate" some kind of animated GIF but with the tiles of a PNG sprite.

  Read Post

• Get the jQuery Version

• JavaScript jQuery

  Create and Retrieve Nested Objects with jQuery

  The ability to create and retrieve nested objects by objectified string path is incredibly useful.  Not only do you not need to do the manual string of object/property checks to avoid "{x} is not defined" errors, but if you create your method properly, you can also set an empty object in its given place (or namespace, some would call it.    Here's how you can add this functionality to the jQuery object.

  Read Post

• .htaccess AJAX JavaScript jQuery Markup

  IFRAME Permission Denied Solution

  I was recently rolling my own AJAX upload script, posting a form to a hidden IFRAME and using the load event to know when the upload was complete.  When the upload completed, I wanted to access the IFRAME content so I could verify that the upload completed successfully.  Surprisingly I ran into the following JavaScript error...

  Read Post

• JavaScript jQuery MooTools

  Function Debouncing with Underscore.js

  The ability to listen and react to user interactions with JavaScript is fundamental and incredibly useful. Some interactions happen frequently and some rarely. Some listener functions are light of action, others can be quite taxing on the browser. Take window's resize event for example: the event fires at each step in the resize, so if you have a taxing event listener, your user's browser will get bogged down quickly.

  Read Post

• Canvas & SVG JavaScript jQuery

  Face Detection with jQuery

  I've always been intrigued by recognition software because I cannot imagine the logic that goes into all of the algorithms. Whether it's voice, face, or other types of detection, people look and sound so different, pictures are shot differently, and from different angles, I cannot fathom how it's all done. Since I already covered booby nudity detection with JavaScript, I thought it would be worth some time to explore face detection. Facebook uses it, so maybe it has application in your websites.

  Read Post View Demo

• jQuery

  jQuery Chosen Plugin

  Without a doubt, my least favorite form element is the SELECT element.  The element is almost unstylable, looks different across platforms, has had inconsistent value access, and disaster that is the result of multiple=true is, well, a disaster.  Needless to say, whenever a developer goes the extra mile to offer solution to these issues, a big smile gets painted on my face.  Harvest recently released Chosen, a SELECT enhancer which offers autosuggest, search, stylability, and an elegant solution for multiple selection.  Better yet, Chosen is available for both jQuery and Prototype.  Let's take a look at how to use Chosen!

  Read Post View Demo

• Dojo JavaScript jQuery MooTools

  Event Delegation with MooTools, Dojo, and jQuery

  I've covered the ins and outs of event delegation within JavaScript a few weeks ago but most developers utilize JavaScript frameworks so I thought I'd take a few moments to show you how to implement this wonderful event strategy with the MooTools, Dojo, and jQuery JavaScript frameworks.

  Read Post