All Posts

CSS Flip-Counter Revisited
June 20th, 2013 / Code

It didn't take long for my CSS counter experiment to break, and after more than a year I thought it was time for a reboot.

Continue reading

CSS Flip-Counter Experiment
December 5th, 2011 / Code

The biggest shortcoming of my flip-counter script is the difficulty in modifying the appearance of the counter—any styling changes require altering 70 different sprite states. I am constantly asked for a nice layered template that would make updating the counter easier, but unfortunately none exists. The best way to make the counter's appearance easily customizable is to get rid of the images entirely, and that was the goal of this experiment.

Continue reading

Logging Disqus Comments with Clicky
April 5th, 2011 / Code

When someone makes a comment on my site, I like to see it in the visitor's action list on Clicky. If you're using Disqus with WordPress, here's an easy way to log comments.

Continue reading

Scrolling Content with jQueryUI Slider
February 5th, 2011 / Code

My first step when thinking of ways to create scrollable content was a Google search that lead me to a good post outlining how to use jQueryUI Slider to scroll a div. This solution required altering the jQueryUI source, which I felt was unnecessary, so I came up with a simple solution.

Continue reading

Creating Apple's New Slide Menu with jQuery
January 30th, 2011 / Code

I don't know how long it's been there, but I noticed yesterday that Apple has a new product nav menu that replaced their old horizontal scroller with some new animated candy. I was impressed to see that all transitions and animations are CSS-based. Unfortunately, it will take some time before all major browsers even support this cool new CSS wizardry. Never fear—you can create a similar menu with jQuery that works in every browser, even IE6.

Continue reading

Apple-Style Counter Revisited
November 15th, 2010 / Code

My original post detailing how I recreated Apple's flip-style counter is a popular one, and I get many questions about how to properly implement it. It didn't take long before I saw some shortcomings to the original technique I used, so I thought it was time to revisit the counter and make some improvements.

Continue reading

Filtering Out the Noise with Regex
July 13th, 2010 / Code

I rely heavily on regular expressions when processing old data. Like my post about cleaning phone numbers, I'll demonstrate another example of how useful regex can be when dealing with unruly data.

Continue reading

YouTube Event Logging
April 25th, 2010 / Utilities

A few months ago, a project bid had me looking at YouTube's JavaScript API for ways to manage a video library through a custom interface. Most of the videos were over 30 minutes, and I thought it would be great if I could provide some analytics on how users were interacting with the videos.

Continue reading

Clicky Monitor, AKA ClickyChrome
March 14th, 2010 / Utilities

Clicky is an amazing web analytics service. Its killer feature is the ability see data in real-time, allowing you to watch your visitors as they browse your site.

I love Clicky, and I love their API. Because the analytics data is available immediately, I found myself wishing I could have a constant notification of how many visitors were on my site without having to leave a tab or window open all the time.

I also love Google Chrome. As soon as LastPass made an extension for it, Chrome became my default browser. After reading a little about Chrome extensions and how they were just HTML and JavaScript, I knew what my next project would be... ClickyChrome.

Continue reading

Apple-Style Counter
February 12th, 2010 / Code

When I saw the 10 billion song counter on Apple's website yesterday, I immediately right-clicked on it to see if it was flash. No big surprise to see that it wasn't, this being Apple, and when I saw it was done using JavaScript I knew how I'd be wasting the next few hours.

Continue reading

Apple-Style Nav Menu
October 1st, 2009 / Tutorials

I'm a big fan of using sprites for navigation menus. While they don't offer the flexibility of a solely HTML & CSS menu due to the fact that you have to create a new graphic every time you want to change a menu item, sprites do offer you infinite styling possibilities. Apple's website is a well-known example of a sprite-driven nav menu, so I'll use that as the inspiration and walk through how to create something similar.

Continue reading

Picasa XML Generator
September 11th, 2009 / Utilities

Two years ago I found myself writing a photo gallery application for a custom CMS that allowed you to upload, crop, caption, group and sort your photos for the site's online galleries. I remember thinking to myself what a chore it was to be reinventing the wheel—there are already excellent free services available that provide this functionality. I wanted the ability to have my client use Picasa to manage his galleries, and view them via SlideShowPro (SSP) on his site. At that time however, support for Picasa's RSS feeds was not available in SSP.

Continue reading

Cleaning Phone Numbers with Regular Expressions
August 30th, 2009 / Code

I've been in the position of having to take an unnormalized database that had virtually no data validation or standardization in place, and migrating it to a normalized schema. I used regex to help me through the process.

Continue reading