Shave

Shave text so that it doesn't get in the way of design

Shave is a javascirpt truncation plugin that doesn't get in the way.

Setup

npm i shave --save-dev

bower i shave --save-dev

Run

1. Add dist/shave.js.
2. shave text within the element you'd like to.

shave('selector', maxHeight);🔥

Basic Examples

Basic

shave('selector', maxHeight);

Or Multiples

shave('selector', maxHeight);

But not this one

shave('selector:not([not this selector])', maxHeight);

With a special symbol

shave('selector', maxHeight, '🍻');

With a special CSS Class

shave('selector', maxHeight, '🙌', 'your-css-class');

Or with jQuery

$('selector').shave(maxHeight);

How?

Shave.js shaves an element's text string to the last full word that can fit within a specified max height.

Why?

Shave.js is made for simpicity; it doesn't try to oversolve truncation or provide tons of options. It truncates text to a specified max height.

What about the original text?

Shave.js re-adds the diff of the original selected elements's text in a hidden <span>. It runs a check for that <span> to make sure text is shaved properly every time.

What about size?

Shave.js is small - ~1.5kb unminified and is meant to do 1 thing - shave text to fit beautifully to a specified max height.

How can I use it?

You can use Shave.js in all modern formats and as a jQuery or Zepto plugin.