我有一个可以在FF3,Safari和IE6 +中使用单行和多行文本的解决方案
.ellipsis { white-space: nowrap; overflow: hidden;}.ellipsis.multiline { white-space: normal;}<div >Lorem ipsum dolor sit amet, consectetur adipisicing elit</div><div >Lorem ipsum dolor sit amet, consectetur adipisicing elit</div><script type="text/javascript" src="/js/jquery.ellipsis.js"></script><script type="text/javascript">$(".ellipsis").ellipsis();</script>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);


