The Pixelize jQuery Plugin

I am unabashedly and unreasonably fond of pixel art. It evokes a nostalgia for a simpler time (tinted generously with the fog of many years) when I would rush home from school, fire up my Nintendo, and try to rescue Zelda from the evil clutches of Ganon.

To that end, I’ve created a simple jQuery plugin that can turn a JavaScript array into CSS pixel art. It looks like this:

See the Pen Pixelize jQuery Plugin by Rob Glazebrook (@rglazebrook) on CodePen.

Read on…

Bouncing Balls in the HTML5 Canvas

Semi-transparent balls bouncing within a dark gray container.

Here’s a fun demo I put together using the HTML5 canvas, aided by the excellent sketch.js framework. I’m creating a whole bunch of semi-transparent balls and bouncing them around on the screen. The demo definitely requires a modern browser (Chrome/Firefox/IE9+).

Read on...

Sizing Images Responsively

Images are sort of a special beast in the HTML animal kingdom. They’re technically inline elements, but they don’t really behave like them. This can cause trouble in responsive web designs. Happily, the fix is simple, safe, and effective.

Read on...

Simple Table Column Highlighting

A table with the third column and second row highlighted.

One design technique I’ve always enjoyed is highlighting the row and column of any cell that the user hovers over. Highlighting table rows is easy, but columns are hard. Or so I thought. Using table cols vastly simplifies the process.

Read on...