Вставьте многоточие (...) в тег HTML, если содержимое слишком велико
У меня есть решение, работающее javascript-library в FF3, Safari и IE6 + с однострочным elasticlayout и многострочным текстом
.ellipsis {
white-space: nowrap;
overflow: hidden;
}
.ellipsis.multiline {
white-space: normal;
}
Lorem ipsum dolor sit amet, consectetur adipisicing elit
Lorem ipsum dolor sit amet, consectetur adipisicing elit
jquery.ellipsis.js
(function($) {
$.fn.ellipsis = function()
{
return this.each(function()
{
var el = $(this);
if(el.css("overflow") == "hidden")
{
var text = el.html();
var multiline = el.hasClass('multiline');
var t = $(this.cloneNode(true))
.hide()
.css('position', 'absolute')
.css('overflow', 'visible')
.width(multiline ? el.width() : 'auto')
.height(multiline ? 'auto' : el.height())
;
el.after(t);
function height() { return t.height() > el.height(); };
function width() { return t.width() > el.width(); };
var func = multiline ? height : width;
while (text.length > 0 && func())
{
text = text.substr(0, text.length - 1);
t.html(text + "...");
}
el.html(t.html());
t.remove();
}
});
};
})(jQuery);
javascript
html
ellipsis
elasticlayout
2021-12-15T03:21:50+00:00
2022-09-22T02:27:40+00:00
TarzanEpt
Вопросы с похожей тематикой, как у вопроса:
Вставьте многоточие (...) в тег HTML, если содержимое слишком велико
Предупреждение о файлах Cookies
Мы используем файлы cookies для улучшения работы сайта. Оставаясь на нашем сайте, вы соглашаетесь с условиями использования файлов cookies. Чтобы ознакомиться с нашими Положениями о конфиденциальности и об использовании файлов cookie, нажмите здесь.