Extension for responsive font
InstallationVanillaJS extension (based on jQuery.fontFlex) for dynamically changing font sizes according to container / browser width. Intended for use with responsive or adaptive CSS layouts.
Include the fontFlex.min.js
before the </body>
of your HTML document:
<script src="fontFlex.min.js"></script> How to Use
Define a default CSS
font base by setting font-size: 1em
and line-height: 150%
on the body
or intended element. Declaring the font-size
is optional, but highly recommended in case javascript is disabled. Finally, call the plugin on said element.
Syntax Example
FontFlex({ min: 20, max: 60, mid: 40, target: 'h1' });
Custom Parameters
min
Minimum font-size in pixels
max
Maximum font-size in pixels
mid
Mid-range buffer. Values ranging from 60 to 70 produce the best results. Lower values produce a larger initial font-size, while higher values produce the opposite. Adjust accordingly to fit your requirements.
![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|
IE 9+ | Latest | Latest | Latest | Latest |
Check CONTRIBUTING.md for more information.
HistoryCheck Releases for detailed changelog.
LicenseMIT
版权声明:
1、该文章(资料)来源于互联网公开信息,我方只是对该内容做点评,所分享的下载地址为原作者公开地址。2、网站不提供资料下载,如需下载请到原作者页面进行下载。