Multiline Ellipsed Text jQuery Plugin - fewlines.js

fewlines.js is a tiny yet robust jQuery responsive text truncation plugin that allows you to truncate long text within any container by the number of visible lines you specify.

How to use it:

1. Insert the main JavaScript JQuery.fewlines.min.js after loading the latest jQuery library.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/JQuery.fewlines.min.js"></script>

2. Call the function on the target text and specify the number of visible lines (default: 2) as follows:

<div id="demo" title="Reveal More Text">
  ...
</div>

$(document).ready(function(){
  $('#demo').fewlines({ 
    lines: 3 
  });
});

3. Enable the Responsive feature, which means that the plugin will automatically re-truncate the text on window resize.

$('#demo').fewlines({ 
  lines: 3,
  responsive: true,
});

4. Determine whether to hide the Read More and Read Less links.

$('#demo').fewlines({ 
  lines: 3,
  noAction: true, // default: false
});

5. Determine whether to reveal the hidden content when hovering over the ellipsis. Default: false.

$('#demo').fewlines({ 
  lines: 3,
  showOnMouseOver: true,
});

6. Override the default text for the Read More and Read Less links.

$('#demo').fewlines({ 
  lines: 3,
  closeMark: 'close',
  openMark: '...',
});

7. Determine whether to add the Read More ellipsis in a new line. Default: false.

$('#demo').fewlines({ 
  lines: 3,
  newLine: true,
});

---

This awesome jQuery plugin is developed by senthilkumar05. For more Advanced Usages, please check the demo page or visit the official website.