October 16th: Navigation, Pathfinding, and Dimensions
Andreas Storm with some subtle and classy fade in animation making a "back button" more robust, with links to other areas of a site.Sponsored:
HelloSign API, developer focused eSign API
Embed documents directly on your website with just a few lines of code.
Lazy Loading with Inline SVG
Mikael Ainalem simulates slow loading images with timeouts in this Pen. The clever part is the SVG shapes that form the placeholders before the images load. Those are much smaller in size than the raster data that comes later.
Typing Text Transition
Rachel Smith created a fun demo where letters animate in as you type into an input. Better still, she shared how it works: a hidden element with normally positioned characters inform the animated and absolutely positioned characters.
Well. Didn't see that one coming.
Path Finder Game
Such a simple concept in this game by Blaz Kemperle, but it's extremely well done, fun, and a bit addictive.
CodePen Radio #147: Content Inventory
Marie and Chris talk about the whys and hows of doing a content inventory on CodePen's documentation.
Launch a Rocketship
A little green creature takes a trip among the stars in Yoon Lee's animated Pen.
Getting Two-Dimensional Coordinates from a One-Dimensional Array
Vincent Maglione gets into the math behind grabbing x and y coordinates from a single, one-dimensional array as an alternative to nested for loops.
The Creative Coding Club's "It's Alive!" challenge is scaring up some creepy stuff, like this watchful skull animated by Ellen Probst.
Stretchy Pants - A Resizable Concept
Jase Smith shares his idea (and code) for a resizable side panel. Watch the code sample update while you drag or double-click the resizer!
Yet Another 2D Tile Map Editor
"[A]lmost a complete map editor for both standard 2d (top-view or platform) and isometric tiles." by Karl Patrik Johansson.