JS Library For Auto Resizing Text and Line-Height - FlowType.JS
File Size: | 2.72 KB |
---|---|
Views Total: | 1735 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

FlowType.JS is a web typography javascript library that automatically adjusting the font size and line-height property of your text to fit the container's width. This allows for a perfect character count per line at any screen width.
Basic usage:
1. Include FlowType.JS script on your web page.
<script src="flowtype.js"></script>
2. Setting a specific font-size and line-height in your CSS file
body { font-size: 18px; line-height: 26px; } h1,h2,h3,h4,h5,h6,p { font-family: inherit; font-size: inherit; } h1 { font-size: 4em; line-height: 1em; } h2 { font-size: 3em; line-height: 1em; }
3. Call the FlowType.JS with options
$('body').flowtype({ minimum : 500, maximum : 1200, minFont : 12, maxFont : 40, fontRatio : 30, lineRatio : 1.45 });
This awesome jQuery plugin is developed by simplefocus. For more Advanced Usages, please check the demo page or visit the official website.