更改字体大小以自动适合Div

Question

我试图让文字自动调整大小以完全适合div。

问题是当文本太大而我的代码无效时。
我正在尝试类似于this的内容。

我无法使用此插件，因为它与我的代码产生冲突，并且在线工作时宽度为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

如果要检测对象是否溢出，可以比较offsetsize和scrollsize

它会像这样工作

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