CSS：Firefox、IEでの-webkit-line-clampの置き換え

Question

text-overflow: ellipsis;プロパティを使用して長いテキストを切り捨てようとしています。 http://jsfiddle.net/TReRs/354/

それはクロームで正常に動作しますが、は-webkit-ラインクランプはFirefoxとIEでサポートされていません。 私はこの

overflow: hidden; 
-webkit-line-clamp: 4; 
text-overflow: ellipsis; 

フィドルを試してみました。誰も私を助けることができる、それのための他のプロパティがあります。

Answer 1

JSソリューション：

var ellipsisText = function (e, etc) { 
    var wordArray = e.innerHTML.split(" "); 
    while (e.scrollHeight > e.offsetHeight) { 
     wordArray.pop(); 
     e.innerHTML = wordArray.join(" ") + (etc || "..."); 
    } 
}; 

使用法：

HTML

<div class="block-with-text"> 
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incidi ut aliquip ex ea commodo consequat sum dolor sit 123 
</div> 

CSS

.block-with-text { 
    line-height: 1.4em; 
    max-height: 5.6em; /* max: 4 lines */ 
} 

JS

[].forEach.call(document.querySelectorAll(".block-with-text"), function(elem) { 
    ellipsisText(elem); 
}); 

JSフィドル：http://jsfiddle.net/TReRs/360/