• Spotlight

fontFlex: Lightweight Extension for Changing Font Sizes

This lightweight jQuery extension is designed to create dynamically changing font sizes according to container and/or browser width. It is intended for use with responsive or adaptive CSS layouts. This is a great tool for helping the text your site look great at any size.

Installation of fontFlex just takes just one step: include the latest version of jQuery and the fontFlex code in the head of the HTML. Then you are ready to configure.

This plugin takes a little code understanding. You’ll need to define a default base setting in the CSS for the font size and line height for the body or intended element to start. (Declaring a font size is recommended.) Then you have to call the plugin on the element.

You can control a few custom parameters such as the minimum and maximum allowable font sizes and a mid-range buffer. The developers of this plugin recommend a buffer value of 60 to 70 for the best results, with lower numbers resulting in larger text and higher values resulting in smaller text.

fontFlex is tested and compatible with Chrome, Safari, IE 8+ and Firefox.