Easy jQuery Text Truncation Plugin With Tooltip Intergrated - shortify

Shortify is a lightweight jQuery text truncation plugin which truncates your long text to a specified number of characters and displays the full text in a tooltip when hovering over the ellipsis.

How to use it:

1. Include the tooltips.css in the head section of your html document.

<link href="tooltips.css" rel="stylesheet">

2. Include jQuery library and the jquery.shortify.js at the end of the document so the page loads faster.

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

3. Call the jQuery function shortify on the text wrapping element and done.

$("p").shortify();

4. Set the maximum number of characters to truncate.

$("p").shortify({
  char_limit: 140
});

5. Set the tooltip position. Accept values: 'tooltip-top', 'tooltip-bottom', 'tooltip-left', and 'tooltip-right'.

$("p").shortify({
  char_limit: 140,
  position:  "tooltip-bottom",
});

6. Customize the ellipsis character.

$("p").shortify({
  char_limit: 140,
  position:  "tooltip-bottom",
  ellipsis: '...'
});

---

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