Truncated.js
January 8, 2018 ยท View on GitHub
Truncated.js
A plugin for effeciently and semantically truncating text.
This project is now called shave and is supported here. ~Thanks
Setup
npm i truncated.js --save-dev
or
bower i truncated.js --save-dev
Run
- Add dist/truncated.js.
truncatetext within the element you'd like to.
truncated('selector', maxHeight);๐ฅ
Basic Examples
Basic
truncated('selector', maxHeight);
Or Multiples
truncated('selector', maxHeight);
But not this one
truncated('selector:not([not this selector])', maxHeight);
With a special symbol
truncated('selector', maxHeight, {character:'๐ป'});
With a special CSS Class
truncated('selector', maxHeight, {character:'๐', classname:'your-css-class'});
Or with jQuery
$('selector').truncated(maxHeight);
How?
Truncated.js trims an element's text string to the last full word that can fit within a specified max height.
Why?
Truncated.js is made for simpicity; it doesn't try to oversolve truncation or provide tons of options. It truncates text to a max height.
What about the original text?
Truncated.js re-adds the diff of the original seleected elements's text in a hidden <span>. It runs a check for that <span> to make sure text is truncated as desired every time.
What about size?
Truncated.js is small - ~1.5kb unminified and is meant to do 1 thing - truncate text to fit beatifully to a specified max height.
How can I use it?
You can use Truncated.js in all modern formats and as a jQuery or zepto plugin.