jquery.ellipsis

What is this?

.ellipsis() adds a class to the last 'allowed' line of text so you can apply text-overflow: ellipsis;. You can view a demo on codepen.io.

How do I use it?

Add the following CSS to your stylesheet:

.ellip {   display: block;   height: 100%; }  .ellip-line {   display: inline-block;   text-overflow: ellipsis;   white-space: nowrap;   word-wrap: normal;   max-width: 100%; }  .ellip, .ellip-line {   position: relative;   overflow: hidden; } 

And then initialise the plugin:

$('.foo').ellipsis(); 

You can customise with the following options:

$('.foo').ellipsis({   lines: 3,             // force ellipsis after a certain number of lines. Default is 'auto'   ellipClass: 'ellip',  // class used for ellipsis wrapper and to namespace ellip line   responsive: true      // set to true if you want ellipsis to update on window resize. Default is false });