Изменить размер шрифта, чтобы автоматически поместиться внутри 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 
}