Question

要显示自定义字体，我想要一个textarea，用户可以使用此自定义字体键入文本。当您键入一个单词时，font-size例如是150px，当您输入更多时，它应该减少字体大小并设置最小值。删除文本应该再次放大字体大小。我用一个简单的脚本尝试了这个，见下文，在输入一定数量的字符后将文字大小减少了一定量，但很难找到合适的比例。输入前几个单词并不会减少字体大小，而使用更多文本会减少字体大小。

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

这是一个非常简单的例子来测试这是否可行，它只会减小尺寸。

我已经看到很多stackoverflow问题和js库（比如FlowType和TextFill）来调整textarea或div的大小以适应文本，但我还没有找到任何关于动态调整文本大小的内容在你键入的文本区域内。

有什么建议吗？

Answer 1

试试这个脚本

$(function(){

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

            });
        });

HTML

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

在键入

1 个答案: