Advertisement
rAthus

[JS] "text-overflow:ellipsis" multilignes

Apr 27th, 2016
282
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. var cutAtSpace = true; // only cut on spaces so words aren't truncated
  2. var ellipseWidth = true; // cut if text overflows width (eg looooong word)
  3. jQuery(document).ready(function($)
  4. {
  5.     $('.ellipsis').css({'overflow-y':'hidden'}).each(function()
  6.     {
  7.         // wrap content so we can measure its height
  8.         if ($(this).find('.wrapper-ellipsis').size()==0)
  9.             $(this).wrapInner('<span class="wrapper-ellipsis"></span>');
  10.         var wrapper = $(this).find('.wrapper-ellipsis');
  11.         var content = wrapper.text().replace().replace(/\s\s+/g,' ').trim();
  12.         // check if content overflows height
  13.         var spliter = cutAtSpace?' ':'';
  14.         var h1 = $(this).height()*1;
  15.         var h2 = wrapper.height()*1;
  16.         if (h2>h1)
  17.         {
  18.             var content_split = content.split(spliter);
  19.             wrapper.html('');
  20.             for (var i=0; wrapper.height()*1<h1 && i<1000; i++)
  21.                 wrapper.append(spliter+content_split[i]);
  22.             var new_txt = wrapper.text();
  23.             if (cutAtSpace)
  24.                 wrapper.html(new_txt.replace(/(\s[^\s]+){2}$/g,'')+' ...');
  25.             else
  26.                 wrapper.html(new_txt.slice(0,-5)+'...');
  27.         }
  28.         // check if content overflows width
  29.         if (ellipseWidth)
  30.         {
  31.             var w1 = $(this).width()*1;
  32.             var w2 = wrapper.width()*1;
  33.             if (w2>w1)
  34.             {
  35.                 var content_split = content.split('');
  36.                 wrapper.html('');
  37.                 var i = 0;
  38.                 while (wrapper.width()*1<w1)
  39.                 {
  40.                     wrapper.append(content_split[i]);
  41.                     i++;
  42.                 }
  43.                 var new_txt = wrapper.text();
  44.                 wrapper.html(new_txt.slice(0,-3)+'...');
  45.             }
  46.         }
  47.     });
  48. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement