更改字體大小以自動適應內部Div

Question

我正在嘗試使文本自動調整大小以完全適合div內。

問題是文本太大，我的代碼無法正常工作。
我正在嘗試類似於this。

我無法使用此插件，因爲它會與我的代碼和div的寬度在線工作產生衝突。
我想在div之後用div的高度做同樣的事情。

請讓我正確我該怎麼辦？

這是我在做什麼jsfiddle

 //horizontally enlarge div and font-size 
    $('#horizontally').on('change', function() { 
     ScaValue = this.value; 
     Originalwidth = $("#backgroundImg").width(); 
     var newWidthofDiv = (Originalwidth/100) * ScaValue; 
     fontsize = newWidthofDiv/10; 
     $("#dragable").css({"width":newWidthofDiv,"height":"auto","font-size":fontsize}); 
    }); 

Answer 1

如果要檢測該對象是否溢出

它會像這樣工作

if(element.offsetHeight < element.scrollHeight || 
    element.offsetWidth < element.scrollWidth){ 
     console.log("element is overflowing"); 
     // change the font size here 
} else { 
    // do probably nothing here 
} 

你可以比較offsetsize和scrollsize