Javascript 键入时动态调整文本区域中文本的大小

要显示自定义字体，我需要一个文本区域，用户可以在其中使用此自定义字体键入文本。例如，当您键入一个单词时，字体大小为150px，当您键入更多单词时，它应以设置的最小值减小字体大小。删除文本应再次放大字体大小。 我用一个简单的脚本尝试了这一点，如下所示，在键入一定数量的字符后，将文本大小减少了一定数量，但很难找到合适的比例。键入前几个单词并不能充分减小字体大小，如果输入更多文本，字体大小会减小得太多

var textarea = $('#textarea');
textarea.bind('change input', function() {
    if (this.value.length % 5 == 0) {
        textarea.animate({'font-size': '-=5px'});
    }
});

这是一个非常简单的例子来测试如果这是可能的，它只会减少大小

我见过许多stackoverflow问题和js库（如and）调整textarea或div的大小以适应文本，但我没有发现任何关于在键入文本时动态调整textarea中文本大小的内容

有什么建议吗？

试试这个 剧本

Html

分享您尝试过的内容。您可以将代码发布在这里或JSFIDLE/jsBin中吗？我已经添加了简单的文本脚本和指向2个js库的链接，我试图使其在textarea上工作，但没有成功。感谢您的解决方案，但问题是如何在textarea中很好地匹配文本。更改字体大小实际上适用于我的代码示例。

$(function(){

        var textarea = $('#box');
        textarea.bind('change input', function() {
            textarea.css({'font-size':(textarea.css('font-size').replace('px','')-3)});

            });
        });

<input type="text" style="width:15px" id="box" />