Displacement Maps

Gradients, shadows, floating columns, etc

per month
  • 10GB Disk Space
  • 100GB Monthly Bandwidth
  • 20 Email Accounts
  • Unlimited subdomains
per month
  • 3GB Disk Space
  • 25GB Monthly Bandwidth
  • 5 Email Accounts
  • Unlimited subdomains
per month
  • 1GB Disk Space
  • 10GB Monthly Bandwidth
  • 2 Email Accounts
  • Unlimited subdomains

Transforming Puppy Boxes

Mouse over the puppies below to see some cool CSS3 effects. Before mousing over the last one, make sure to say "roll over!"

Previous Work

Although the site is no longer up, this is what Skillville Games looked like circa 2012. I developed the entire CSS and HTML foundation of the site (although I didn't create the visual design).

skillville games front page

Object Oriented JS

Type something to print below, as a whisper, shout, or just normally. Check out the code in your browser, and you'll see the way I did this was by making a master Talk class, then creating methods and subclasses, leveraging JavaScript's inheritance.



Press the buttons to load content into the box using different AJAX methods (view source for details). Note: The AJAX and JSON examples won't work in a local environment without a server. There's a live version on my website:

Some content we want to update...

JSON (JavaScript Object Notation)

The goal here is to read JSON from the server using two methods: the $.getJSON shorthand, and the full-bown $.ajax() method. If successful, we should see the box below the buttons get populated with a table of contents from the book "JavaScript: The Good Parts" by Douglas Crockford.

Table of contents should show up here...

JSONP (JSON With Padding)

This example integrates with a third party API so you can look the city and state of any zip code!


I have already used jQuery in the AJAX and JSON examples above, but here's some more (see source for details):

Example 1: Making things sortable (drag and drop) in a more cross-browser-compatible way than CSS3 can currently provide. Try re-ordering the donuts below in order of deliciousness.

Example 2: Datepickers. HTML5 provides a datepicker, which eventually will be better from an accessiility standpoint, but for now this is the most widely-supported way to go.

Example 3: Effects. Click on Wile E. Coyote to make a random effect happen to him!

wile e coyote

Example 4: Animation transitions. Similar to CSS3 transitions, but with a larger variety of effects, and more cross-browser compatibility. Note: This example is still under construction.

ThiS iS CraZY!!!

Coming very soon...