jxnblk / Fitter Happier Text
Performant, fully fluid headings
Stars: ✭ 1,303
Labels
Fitter Happier Text
Performant, fully fluid headings
Usage
Include dist/fitter-happier-text.js
in your project or install from NPM:
npm install fitter-happier-text
(or download it https://github.com/jxnblk/fitter-happier-text/archive/0.0.1.zip)
Pass it a nodelist.
var nodes = document.querySelectorAll('[data-fitter-happier-text]');
fitterHappierText(nodes);
Fitter Happier Text replaces each node with an SVG text node and sets the viewBox
attribute based on its width and height.
To adjust for different fonts, use the baseline
and paddingY
options. paddingY
can be set to a negative value to reduce the height of the SVG container.
fitterHappierText(nodes, { baseline: 14, paddingY: 2 });
Browser support:
Please note: I do not plan on adding any SVG polyfills to handle old browsers.
MIT License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].