Here’s a stupid thing I made. It’s like a screensaver, I guess, but in a browser… and with tweets about tacos flying out of a swinging taco, oh, and also the tweets are on tortilla chips and the background is parallaxed taco ingredients.
Just click: http://tacosfordinner.com/
Stack, Tech, etc
- Some markup from HTML5 Boilerplate
- Data from Twitter’s GET Search API
- {{ mustache }} templating JSON data
- Nominal Modernizr degradation attempt
- Gloria Hallelujah font served with Google Web Fonts
- Imagery drawn in Flash
- CSS sprite made with Sprite Cow
- Standalone, homescreen mode for iDevices. Not perfect, but okay.
- ASCII art in source
Originally needlessly written in Node but rewritten to just be normal JavaScript.
Works best in Webkit browsers. Does okay in Firefox* if you’ve got a lot of memory. Obviously doesn’t work in browsers without good CSS3 support, but should degrade anticlimactically.
* Oddly enough, I wrote the CSS with Firefox and had animations running on pseudo-elements, but it turns out that isn’t supported in Webkit. By the time I figured that out and started worrying about semantics, I decided it was time to throw in the towel. Anyway, the taco image has some super minor parallaxing in Firefox.