Question

我寻求拥有一个可满足的div，当用户输入文本时，它会自动调整其字体大小我设法得到我想要的结果（见jsfiddle）

$("#TextIn").on("keyup",function(event)  
{  
    $("#TextIn").css({"font-size":"200px"});  
    while($("#TextIn").innerHeight() >= $("#NoteWrapper").innerHeight())  
    {  
        $("#TextIn").css({"font-size":parseInt($("#TextIn").css("font-size"))-1 + "px"});  
    }
});

在“KeyUp”事件期间更新字体大小在图形渲染之后我有一些难看的效果（当按下按键时，换行符出现并消失......）

我正在寻找一种在视觉渲染之前计算和应用正确字体大小的方法，任何想法？

提前致谢。

Answer 1

为了避免因错误检查而导致的闪烁效果，您可以尝试“聆听”。 DOM改变你的元素。

$("body").on('DOMSubtreeModified', "#TextIn", function(){
    ...
});

在contenteditable div上调整字体大小

1 个答案: