/**
* Функция для сокращения длинного текста
* @var object element - элемент, в котором необходимо укоротить текст
* @var int count_lit - лимит символов
* @var bool light - true|false задать осветление последних символов или нет
*/
function cutLongString(element, count_lit, light){
// текст в блоке
var text = element.html();
// длина текста в блоке
var all_len = text.length;
// хранилище для нового текста
var new_text;
// если текст больше заданного лимита, то обрезаем его
if (all_len > count_lit){
// обрезаем текст и добавляем три точки в конец
new_text = text.substr(0, (count_lit - 3)) + '...';
// если необходимо задать осветление последним символам
if(light){
// кусок обычного текста
var first_part_text = new_text.substr(0, (count_lit - 10));
// кусок текста, который будет осветлен
var light_part_text = new_text.substr((count_lit - 10), count_lit);
// переменная, для хранения осветленного текста
var light_text = "";
// цвета для последний 10 символов
var array_color = ["#444444", "#545454", "#646464", "#747474", "#848484", "#949494", "#a4a4a4", "#b4b4b4", "#c4c4c4", "#d4d4d4"];
// перебираем по одному символу текст, который будет осветлен
for(var i = 0; i < 10; i ++){
// оборачиваем каждый символ в span и задаем ему цвет
light_text += "<span style='color: " + array_color[i] + "'>" + light_part_text.substr(i, 1) + "</span>";
}
// склеиваем две части текста
new_text = first_part_text + light_text;
}
// заменяем текст в блоке
element.html(new_text);
}
}$(document).ready(function(){
// после загрузки страницы вызываем функцию
// обрезание с осветлением
cutLongString($('.example_div'), 21, true);
// обрезание без осветления
// cutLongString($('.example_div'), 21, false);
});