CSS Writing Modes
You can use a little-known, yet important and powerful CSS property to make text run vertically.
Or instead of running text vertically, you can layout a set of icons or interface buttons in this way. Or, of course, with anything on your page.
[…]
If you do want a bit more of a taste, look at this example that adds
text-orientation: upright;to the mix — turning the individual letters of the latin font to be upright instead of sideways.
Code language: CSS
h1 {
writing-mode: vertical-rl;
text-orientation: upright;
text-transform: uppercase;
letter-spacing: -25px;
}
Fun with Staggered Transitions - Cloud Four
I was prototyping a sliding view transition between nested levels of navigation:
While this sort of transition had worked well for past projects, it didn’t feel quite right for this one. I wanted it to have a little more personality, to feel like it was organically reacting to the item you selected.
I thought it might be cool to stagger the animation, so the selected item began moving first, with its siblings following as if tethered together:
