Don't animate the text size! 😡
Hi, *|USERNAME|*!
In animation and film, so many of the things we animate will directly or indirectly involve adjusting the size of some text. The size of text will jump up. It may jump down. It may do some sliding at the same time while jumping and zooming. It's one of those animation effects we take for granted as both viewers and creators. As you can imagine, there is a gotcha here. When it comes to animating the size of text on the web, our browsers do some weird things that makes them look bad.
Here is an example:
Pay close attention to how the text scales up when you hover over and how the scale resets when you hover out. The effect is subtle, but you can see that the text erratically jumps and shifts a few pixels each time its size is increased. Once you see it, though, you can probably never unsee it.
In the latest article on the site, I discuss why animating the size of text is a bad idea. It has to do with browser quirks that go beyond our control. The article also discusses ways of minimizing the weird behavior in case you have no choice but to animate the size of some text.
Arrays: From Noob to Ninja
If you've been wanting to go deep into the fun and mysterious world of Arrays in JavaScript, then Kirupa read your mind and wrote a brand new book...just for you!
Check it out from your largest online book retailer.
Buy on Amazon
TILL NEXT TIME!
As always, before I leave you to it, I would love to hear from you on things I can do better, topics you'd like me to write about, and more. Don't be shy! The easiest way to contact me is via Twitter or by posting on the forums like the MySpace days!
Cheers,
Kirupa 😃