Minimalist jQuery Text Truncation Plugin - Curtail

File Size: 5.36 KB
Views Total: 3046
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimalist jQuery Text Truncation Plugin - Curtail

Curtail is an ultra-light (less than 1kb) jQuery plugin which adds the text truncation and read more/less functionalities to your long text block.

Features:

  • Truncates long text by characters.
  • Custom ellipsis.
  • Allows to toggle hidden text with read more / read less links.

How to use it:

1. Wrap your text along with a toggle link into a container.

<div class="demo">
  <p>Your Text Here</p>
  <a href="#">Read More</a>
</div>

2. Place jQuery library and the jQuery Curtail's script in the webpage where needed.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jQuery.curtail.js"></script>

3. Call the function on the wrapping element and specify how many number of characters to be shown.

$('.demo').curtail({
  limit: 140
});

4. Customize the ellipsis character.

$('.demo').curtail({
  limit: 140,
  ellipsis: '...'
});

5. Enable the 'toggle' mode and define the text labels.

$('.demo').curtail({
  limit: 140,
  toggle: true,
  text: ['show less', 'show more']
});

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