Category: frontend
OCT 29 2011
Using Javascript Timeouts for Performance
Wait, what? Doesn't setting timeouts in Javascript delay a piece of code from being run for an X amount of time, so how could it possibly help with performance? Imagine writing a Javascript app that is doing some large, computationally-expensive task like adding a five thousand elements to the DOM:...
AUG 18 2011
Subtle Inset Styles
It's the mark of a great designer when someone comes to your site and knows it looks good, but doesn't know why. I love using subtle styling in my designs and one of my favorites is applying inverse drop shadows to give the appearance that something is inset. Take my...
JUL 30 2011
Ajax Partial Loading
In today's applications, it's common to use AJAX to load dynamic parts of a website without having to do a full page refresh. With Rails, it's easy to template these changes instead of using Javascript to update the DOM structure manually. Imagine you have some portion of the page (say,...
JAN 27 2011
JQuery Autocomplete with hidden data
This is a problem that I've encountered many times before when building Rails apps, but didn't know how to solve elegantly until one of my friends pointed out the solution was directly in the JQuery Autocomplete documentation (in my defense, it was at the _very_ bottom). Imagine you have an...
JAN 08 2011
Sticky Footers
Sometimes, in websites that you design, you'll find that you want to implement some kind of footer (with copyright information, contact links, etc). The naive way to go about adding a footer to your design to just add a div with some fixed (or `auto`) height at the bottom, like...
AUG 10 2010
CSS Shorthand
For all of you CSS coders who are pretty lazy (myself included), you can use CSS shorthand to type out certain properties in one line instead of many many lines. Here's an example: Say you want to add a background image to your fancy new website using CSS. And it...
AUG 03 2010
JQuery Draggable and Droppable
On a whim, I recently whipped together and launched [REOrganize](http://reorganize.amberfeng.com), a small JavaScript application that lets users simulate arranging furniture around in a room via dragging and dropping. To build this quickly, I utilized [JQuery's fantastic UI library](http://jqueryui.com/) full of ready-made effects and widgets. To take advantage of these effects...
JUL 23 2010
Setting Cookies with JQuery
I've never really used or dealt with browser cookies before because I felt like it was some complicated, advanced technique that required intricate knowledge of how browsers and sessions work. Today at work, I was given a task that involved setting, checking, and removing cookies for our web application, but...
JUL 22 2010
Detecting Mobile Devices for Web Applications
As mobile devices become a bigger and bigger platform for viewing web pages, web application developers need to start paying attention to making their websites mobile-friendly. Have you ever visited a website from a smartphone that was obviously not mobile optimized? It's not a great experience, having to zoom in...
JUL 21 2010
IDs vs. Classes?
IDs should generally be used when the element is unique, whereas classes should be used when there are a lot of similar elements that need the same styling. It would be perfectly legal to use IDs for every single element on a page (if they are unique, of course), but...
JUL 13 2010
Basic (CSS) JQuery Selectors
I love JQuery. Oh so easy to use, excellent documentation, and an abundance of third-party plugins and widgets ready made for almost anything you could ever need. Of course, one of the most important parts of the library are JQuery's selectors, easy CSS-like syntax to select specific DOM elements to...
JUN 29 2010