Это был не самый распространенный вариант, а теперь сюрприз, самый распространенный:
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
(function( $ ){
$.fn.correctLines = function( maxLine, moreText ) {
var self = this[ 0 ], temp, classes, i, lineHeight;
maxLine = ( temp = /^(?:.*\s)?fixline_([\d]+)(?:\s.*)?$/.exec( self.className ) ) && temp[1] || maxLine || 3;
moreText = moreText || '...<br />';
var clone = $( self ).clone( true ).
css( {"height": "auto", "width": self.offsetWidth + "px"} ).html("W");
clone.appendTo( document.body );
lineHeight = this.css('line-height');
if ( lineHeight == "normal" ) {
lineHeight = clone[0].clientHeight;
} else if ( ( lineHeight + '' ).indexOf("px") > 0 ) {
lineHeight = parseInt( lineHeight );
} else {
lineHeight = parseInt( this.css('font-size') ) * parseFloat( lineHeight );
}
var height = lineHeight,
width = self.offsetWidth,
lines = 0,
lastHeight = 0,
startWord = 0,
endWord = -1,
txt = self.innerHTML.split(" "),
part = [];
clone.empty();
for( i = 0; i < txt.length; i++ ) {
clone[0].innerHTML += txt[ i ] + ' ';
if ( clone[0].offsetHeight > lastHeight ) {
if ( lastHeight == 0 ) {
height = clone[0].offsetHeight;
}
startWord = endWord + 1;
endWord = i - 1;
lastHeight = clone[0].offsetHeight;
if ( ++lines > maxLine ) {
break;
}
}
}
if ( lines > maxLine ) {
this.css({height: ( lineHeight * maxLine ) + "px", overflowY: 'hidden'});
part = txt.slice( startWord, endWord + 1 );
for( i = part.length - 1; i >= 0; i-- ) {
clone.html( part.join(' ') + moreText );
if ( clone[0].offsetHeight > height ) {
part.splice( i, 1 );
endWord--;
} else {
break;
}
}
txt[ endWord ] += moreText;
self.innerHTML = txt.join(" ");
} else {
this.css({height: "auto"});
}
clone.remove();
}
})( jQuery );
</script>
<style>.fvem{width:200px;font-size:14px;border:1px solid #000000;}</style>
<div class="fvem">
<div class="correct_comment">Loremipsud <div style="font-size:45px">olorsitmet</div>, consecteturad ipiscingelit. Nulla tincidunt nunc commodo magna posuere sollicitudin. Quisque ultrices sodales nisi eu sagittis.</div>
</div>
<script type="text/javascript">
jQuery(".correct_comment").correctLines( 3, '<span onclick="jQuery(this).parent().css(\'height\', \'auto\').end().hide();">... <span style="color: #f00; text-decoration: underline; cursor: pointer;">more</span></span>' );
</script>