文本調整在基於寬度元件，用於環路

Question

https://jsfiddle.net/bx060jsd/10/

我已經創建的JavaScript/jQuery的，如下所示：

 curWidth = document.getElementById('tagPhrase').offsetHeight; 
    for (i = 30; curWidth > 100; i--) { 
     $('#tagPhrase').css("font-size", i); 
    } 

其被設計爲內#tagPhrase降低字體大小而#tagPhrase所述的offsetHeight大於100.但它似乎沒有工作。我錯過了什麼？

Answer 1

試試這個：

HTML：

<p id="tagPhrase" style="font-size:50px"> 
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. 
</p> 

的Javascript：

var element = document.getElementById('tagPhrase'), 
    curWidth = element.offsetWidth, 
    currentFontSize = parseInt(element.style.fontSize); 

while(curWidth > 100 && currentFontSize > 2) { 
    currentFontSize--; 
    element.style.fontSize = currentFontSize+"px"; 
    curWidth = element.offsetWidth; 
} 

演示：

https://jsfiddle.net/vz2j8baj/