Apple's new iPhone 4S came with a new page design, which features a particularly neat CSS animation trick — it's all one slide. Unlike pages for the Macbook Air and iPad, which use a simple left-to-right scroll of slides, the iPhone 4S page is made up of a rotating box containing all six slides which allow for fluid transitions and perpetually repeating slides.
Apple’s iPhone 4S CSS animation shows extra design detail


We know this because software engineer John B. Hall took the time to put together a fascinating animation on his website showing a “zoomed out” view of how each animations moves in and out of your web browser. John’s made the full animation available on his website for those who want to see it in action.
Follow topics and authors from this story to see more like this in your personalized homepage feed and to receive email updates.











