4 ms·
This is really well done and polished. Great stuff. About a year ago when I was bored, I made a quick and dirty codepen [1] of the exact same thing you have her
by scotchio 12y ago
This is really well done and polished. Great stuff. About a year ago when I was bored, I made a quick and dirty codepen [1] of the exact same thing you have here. I added a transition to it so you can type to switch the letters.
I also made it so you can type with pure CSS letters [2]. It's nothing great like what you've done, but I'd thought I would share anyways.
[1] http://codepen.io/ncerminara/pen/yFcfn http://codepen.io/ncerminara/pen/yFcfn
[2] http://codepen.io/ncerminara/pen/cEbGC http://codepen.io/ncerminara/pen/cEbGC
- xasos 12y agoWoah the on keypress animations look awesome!
- cs- 12y agotransitions are really nice, apply those to this font and you got something
- shdon 12y agoThe non-webkit-transform is missing on the .t::before.
- saidajigumi 12y agoI've come to love autoprefixer[1] on a current project for just this reason. It's a CSS preprocessor that deals with prefixing and property syntax changes across browser versions. Usage: 1. Write unprefixed CSS 2. Tell autoprefixer what browser versions to support 3. It adds the correctly prefixed properties for you Interestingly, autoprefixer uses the property support data from caniuse.com to determine what prefixes to apply. [1] More info and link to interactive demo at: https://github.com/postcss/autoprefixer https://github.com/postcss/autoprefixer
- runeks 12y agoVery cool! FWIW, it feels more responsive to react on keydown rather than keyup, IMHO: http://codepen.io/runeks/pen/PwxdEm http://codepen.io/runeks/pen/PwxdEm