jQuery.smarttruncation truncates the text within the assigned element to fit and updates the string length while resizing the window.
The used technique is very responsive, since it calculates the width for each character in a pre-define set ahead of time. The generated sizes dictionary is cached and re-used if the plugin is called on an element with identical font properties.
Sometimes (in about 3-5% of all cases), due to characteristics of certain fonts, a string will still not fit. In this case the plugin will go the "common" way of chopping off on character at a time until the string fits.
The plugin can be used on file names by setting the protectExtensions
option to true
, keeping the extension intact.
Setting truncateCenter
to true
will truncate from the inside out ("Hello World" becomes "Hel…rld").
<ul class="list">
<li>
Lorem ipsum dolor sit amet aliquip äx ea commodo consequat
adipisicing elit, sed do aliquip
</li>
<li>
Consectetur adipisicing elit, sed do aliquip ex ea commodo
consequat
</li>
<li>
Eiusmod tempor incididunt aliquip ex ea commodo consequat
</li>
</ul>
<ul class="file-list">
<li>
Ruby Programming_Syntax_Classes - Wikibooks, collection
of open-content textbooks.pdf
</li>
<li>
Some_very_long_filename_for_a_keynote_presentation_
still_going_on_and_on_and.key
</li>
<li>
newsletter-subscription-optin-module.1.1.6.zip
</li>
</ul>
<ul class="centered-list">
<li>
Lorem ipsum dolor sit amet aliquip äx ea commodo consequat
</li>
<li>
Consectetur adipisicing elit, sed do aliquip ex ea commodo
consequat
</li>
<li>
Eiusmod tempor incididunt aliquip ex ea commodo consequat
</li>
</ul>
$(function(){
$('ul.list li').smartTruncation();
$('ul.file-list li').smartTruncation({
'protectExtensions' : true
});
$('ul.centered-list li').smartTruncation({
'truncateCenter' : true
});
});
Copyright (c) 2012 Florian Plank (http://www.polarblau.com/).
Dual licensed under the MIT (MIT-LICENSE.txt)
and GPL (GPL-LICENSE.txt) licenses.