Truncate Long Text To A specified Number Of Lines – thellipsis

Preview:

Description:

thellipsis is a tiny vanilla JavaScript multi-line text truncation plugin that makes it possible to truncate your long text to a specified number of lines.

The JavaScript plugin hides the text content that exceeds the max lines and adds an ellipsis to the end of the truncated text.

Fully responsive and mobile-friendly. Also works with the window resize event.

See also:

• 10 Best Multi-line Text Truncation Plugins

How to use it:

1. Download and import the thellipsis.js library.

<script src="./src/thellipsis.js" defer></script>

2. Attach the plugin to the text and specify the max number of lines.

<p class="thellipsis">
  Multi-line Text Here
</p>

const elementsThatShouldEllipsis = document.getElementsByClassName('thellipsis');
window.onresize = function () {
  Array.prototype.forEach.call(elementsThatShouldEllipsis, function (element) {
    // thellipsis(element, max_lines, debug);
    thellipsis(element, 2, true);
  });
}
window.dispatchEvent(new Event("resize"));

Changelog:

08/11/2022

• JS Update