JS Library For Auto Resizing Text and Line-Height - FlowType.JS
| File Size: | 2.72 KB |
|---|---|
| Views Total: | 1781 |
| 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.











