Truncate Long Text To A specified Number Of Lines – thellipsis

Category: Javascript , Text | December 19, 2019
Author:thbighead
Views Total:142 views
Official Page:Go to website
Last Update:December 19, 2019
License:MIT

Preview:

Truncate Long Text To A specified Number Of Lines – thellipsis

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:

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"));

You Might Be Interested In:


Leave a Reply