下面附两种解决多行文本溢出的方案
$('.fig').each(function (i) {
var divH = $(this).height();
var $p = $('p', $(this)).eq(0);
while ($p.outerHeight() > divH) {
$p.text($p.text().replace(/(\s)*([a-zA-Z0-9]|\W)(\.\.\.)?$/, "..."))
}
});
//这种方式不如第一种好~
var Overflow = (function () {
function _text() {
this.ele = arguments[0];
}
_text.prototype = {
//根据字体大小 行高 求出 clamp
deal: function () {
var height = parseInt($('#pp').css('height'));
var lineHeight = this.ele.css('line-height');
var fontSize = this.ele.css('fontSize');
var num = (height / (parseInt(fontSize) + (parseInt(lineHeight) - parseInt(fontSize)))).toString();
alert(num);
this.ele.css('-webkit-line-clamp', function () {
return num.indexOf('.') > 0?num.substring(0, num.indexOf('.')):num;
});
}
};
return _text;
})();
new Overflow($('#pp')).deal();