Stately has been making the rounds and I decided to play around with it.
The idea of making a with nothing more than some html and css is pretty cool. It’s also a huge departure from how I would usually make a map for the web.
First up, I wanted to do something similar to the map at the top of the Stately homepage. Instead of digging into the code behind that map, I decided to try to build my own. Since the map is an unordered list(ul) with each state being represented by a list item(li), my first thought was to animate the color property for each element (state). And it worked!
Next, I wanted something a bit more interactive. I ended up building a little game where a state is highlighted and a user is expected to type the two letter abbreviation for the state. Check it out.
The code for both is up on Github.