Best of JavaScript, HTML5 & CSS3 - Week of November 5, 2012

Posted on Nov 12, 2012

This week features a lot of general JavaScript, HTML and CSS tutorials while only a few framework-specific tutorials. There were also quite a few mobile-specific tutorials as well as a handful of important library releases including Ratchet, ChocolateChip-UI and FireClosure.


The 4th part of this series on building a retro Battle on the High Seas game creates the depth charges and torpedoes.
Gaming: Battle on the High Seas, Part 4

Fabrice Weinber shows how to recreate the Facebook loading animation in pure CSS.
The Facebook Loading Animation in CSS

An excellent tutorial on writing fast, memory-efficient JavaScript by understanding how the underlying engines work from Addy Osmani.
Writing Fast, Memory-Efficient JavaScript

Patkos Csaba shares 7 common Javascript mistakes to avoid (as well as a number of others not JS related).
20 All Too Common Coding Pitfalls For Beginners

Raymond Camden covers how to build data-driven animations by tying in to Edge Animate events.
Data-driven Edge Animate projects

Chris Coyier demonstrates how to build an off-canvas menu with CSS :target that slides in on-demand.
Off Canvas Menu with CSS :target

Nicholas Zakas continues his series on ECMAScript 6 collections by discussing WeakMaps which use objects for keys.
ECMAScript 6 collections, Part 3: WeakMaps

The Airbnb development team released their useful JavaScript style guide.

Mary Lou created Gamma Gallery, a really interesting proof of concept responsive image gallery built using jQuery Masonry.
Gamma Gallery: A Responsive Image Gallery Experiment

David Walsh shares five more HTML5 APIs you may not know existed including the fullscreen, page visibility, getUserMedia and battery API's.
5 More HTML5 APIs You Didn’t Know Existed

Keith Clark shares an interesting hack that moves IE specific CSS into @media blocks.
Moving IE specific CSS into @media blocks

Oskar Eriksson discusses the challenges of using the HTML5 web audio API when creating the JAM with Chrome project.
Case-study: JAM with Chrome - How we made the audio rock

Libraries and Frameworks

Ryan Niemeyer posts a great tutorial to get started with templating and data-binding with Knockout.js.
Getting started with Knockout.js

Raymond Camden shows how to use Node and Express to build a proof of concept Edge Inspect screenshot viewer web app.
Proof of Concept - An Edge Inspect Screenshot Viewer

Alex Young shows how to use Watch.js to observe properties on objects and respond to changes.
How Does Watch.js Work?


Andy Matthews gives a great overview of the updates that were included in the recent jQuery Mobile 1.2 release.
The Latest Updates to jQuery Mobile

Simon MacDonald shows how to build a native menu for Android and hook that into your PhoneGap app.
Building a Native Menu with PhoneGap Android

Ratchet is a new project for rapid prototyping iPhone apps and Ryan Stewart gets it working with PhoneGap.
Using Ratchet with PhoneGap

According to Max Firtman, detecting the iPad Mini using HTML5 may not be possible.
Mission: Impossible – iPad mini detection for HTML5

New and Updated Libraries and Frameworks

FireClosure is a Firebug plugin that allows you to inspect JavaScript closures.
FireClosure – JavaScript Closure Inspector

Ratchet lets you prototype hybrid HTML, CSS and JavaScript mobile applications for iPhone.

ChocolateChip-UI has been updated with a new theme to target Android 4.2 Jelly Bean.
ChocolateChip-UI 2.1 for Android

Bootup.js will cache and load static files from local storage to improve the startup time of your web app.

Glazz by Mary Rose Cook is a new library that models vision in a 2D world for use in games.


My guest post on how to break or advance your career as a front-end HTML and JavaScript developer.
Breaking In To A Front-End Development Career

Liffect will generate the code for a number of nice effects for lists.
liffect - effects for lists


There are currently no comments for this the first!

Write your comment

(it will not be displayed)


My name is Brian Rinaldi and I am the Web Community Manager for Flash Platform at Adobe. I am a regular blogger, speaker and author. I also founded RIA Unleashed conference in Boston. The views expressed on this site are my own & not those of my employer.