Trim Text To Specified Number Of Lines - Vertical Truncator
| File Size: | 4.77 KB |
|---|---|
| Views Total: | 2853 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
The Vertical Text Truncator jQuery plugin allows you to trim long text to a specific number of rows and replace the truncated part with a "... Read More" link.
Cross browser, easy to use and fully responsive.
How to use it:
1. Load the script jquery.vertical-truncator.js after the latest jQuery library (slim build is recommended).
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"
integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n"
crossorigin="anonymous">
</script>
<script src="jquery.vertical-truncator.js"></script>
2. Initialize the Vertical Text Truncator on document ready.
jQuery(document).ready(function() {
vertically_truncate();
});
3. Add the data-vertical-truncator attribute to the text to be truncated and define the number of lines to preserve as follows:
<h1 data-vertical-truncator="3"> The actual size of the character that a user sees is dependent both on the author-defined size and the user's display or user-agent settings. For many mainstream body text fonts, 14 and 18 point is roughly equivalent to 1.2 and 1.5 em or to 120% or 150% of the default size for body text (assuming that the body font is 100%), </h1> <h1 data-vertical-truncator="2"> The actual size of the character that a user sees is dependent both on the author-defined size and the user's display or user-agent settings. For many mainstream body text fonts, 14 and 18 point is roughly equivalent to 1.2 and 1.5 em or to 120% or 150% of the default size for body text (assuming that the body font is 100%), </h1> <h1 data-vertical-truncator="1"> The actual size of the character that a user sees is dependent both on the author-defined size and the user's display or user-agent settings. For many mainstream body text fonts, 14 and 18 point is roughly equivalent to 1.2 and 1.5 em or to 120% or 150% of the default size for body text (assuming that the body font is 100%), </h1>
This awesome jQuery plugin is developed by stamat. For more Advanced Usages, please check the demo page or visit the official website.











