Font resize detection

 In Javascript

We all crashed into the problem where a website’s layout gets ruined when zooming in or out the font-size in the browser…

You can read a really good article from ALA giving a nice insight with regards to what approach should you take in the early development phases towards avoiding various zooming problems: http://www.alistapart.com/articles/fontresizing/

Most complex designs don’t allow so much flexibility such that you can make things really scalable via the CSS, so our most used option will probably be a touch of Javascript.
As on most of my projects jQuery is a standard, I chose to use a little jQuery plug-in that does the job of detecting the font-resize event really well:

http://wellstyled.com/en/javascript-onfontresize-jquery-plugin/

Once you caught the event you can do any kind of magic :)

What approaches did you take to solve such situations ?

Recommended Posts

Leave a Comment

Contact Us

We're not around right now. But you can send us an email and we'll get back to you, asap.

Not readable? Change text. captcha txt

Start typing and press Enter to search