jQuery dotdotdot...

Truncate multiple line content:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. It has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. Lorem Ipsum has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. Read more »

What is dotdotdot

Dotdotdot is a jQuery plugin for truncating multiple line content on a webpage. It adds an ellipsis to indicate that there is more text than currently visible. Optionally, the plugin can keep a "read more" anchor visible at the end of the content, after the ellipsis.

When using the jQuery.dotdotdot plugin, you don't need to worry about your HTML markup, the plugin knows its way around most elements. It's responsive, so go ahead and resize your browser, the ellipsis will update on the fly.


The jQuery.dotdotdot plugin is free to use for personal or non-profit usage. You can purchase a license if you want to use it in a commercial project (including plugins, themes and templates you plan to sell).

Before purchasing a license, please make sure the jQuery.dotdotdot plugin is suitable for your project. You can do this by downloading the free version and purchasing a license later on.

Single website license $5
  • Future updates
  • 1 Commercial project
  • Community support
Buy This license allows the jQuery.dotdotdot plugin to be used by you or one client, in a single commercial end product.
Multiple websites license $35
  • Future updates
  • Unlimited commercial projects
  • 1 Year premium support
Buy This license allows the jQuery.dotdotdot plugin to be used by you or your clients, in an unlimited number of commercial end products.

Paid plugins, themes and templates

By purchasing ONE "Multiple websites license", you are allowed to include the jQuery.dotdotdot plugin in ONE product (for example a plugin, theme or template) for sale. Customers and users of your product do not need to purchase their own license.


Use a CDN to host the files:


Install the plugin with NPM:
npm install jquery.dotdotdot


Download directly from the Github repository.

How to use the plugin

First, include all nessesary .js files in your webpage.

<script src="jquery.js"</script>
<script src="jquery.dotdotdot.js"</script>

Second and last, fire the plugin onDocumentReady on the element you want to truncate.

jQuery(document).ready(function( $ ) {

      // Options go here



The plugin uses a few options that can be set in the options-object:

jQuery(document).ready(function( $ ) {


      callback: function( isTruncated ) {},
      /* Function invoked after truncating the text.
         Inside this function, "this" refers to the wrapper. */

      ellipsis: "\u2026 ",
      /* The text to add as ellipsis. */

      height: null,
      /* The (max-)height for the wrapper:
         null: measure the CSS (max-)height ones;
         a number: sets a specific height in pixels;
         "watch": re-measures the CSS (max-)height in the "watch". */

      keep: null,
      /* jQuery-selector for elements to keep after the ellipsis. */

      tolerance: 0
      /* Deviation for the measured wrapper height. */

      truncate: "word",
      /* How to truncate the text: By "node", "word" or "letter". */

      watch: "window",
      /* Whether to update the ellipsis: 
         true: Monitors the wrapper width and height;
         "window": Monitors the window width and height. */



After the plugin is fired, a series of methods is available through the API, which is stored in the "dotdotdot" data-attribute:

jQuery(document).ready(function( $ ) {

   var API = $("#wrapper").dotdotdot({
      // Options go here
   }).data( "dotdotdot" );

   /* Returns the Class instance. */

   /* Starts the truncate process. */

   /* Restores the original content. */

   /* Completely restores the wrapper to its pre-init state. */

  /* Starts monitoring the wrapper or window width and height. */

  /* Stops monitoring the wrapper or window width and height. */