javascript - A nice algorithm for font-size relative to number of chars and screen width -


ok, have input field big font (100px). thought when user starts writing letters, font size lower instead of phrase moving off screen.

its gotta responsive well, algorighm includes screen width nice.

what have now:

var chars = $('#big-search').val(); var w = $(window).innerwidth();  var fz = parseint($('#big-search').css("font-size"), 10); console.log(fz); var nfz = 100-((chars.length/w)*(w*2.2)); if(nfz < 100){     $('#big-search').css("font-size", nfz+"px") } 

the problem speeds lowering of font size. should rather slow down.

any thoughts on this?

this did trick:

var basefz = 100; var chars = $('#big-search').val(); var w = $(window).innerwidth(); var nfz = (w/100)*(basefz/chars.length);  if(nfz <= 100 && nfz >= 20){     $('#big-search').css("font-size", nfz+"px"); } else if(nfz >= 100){     $('#big-search').css("font-size", 100+"px"); } else if(nfz >= 20){     $('#big-search').css("font-size", 20+"px"); } 

Popular posts from this blog

How to calculate SNR of signals in MATLAB? -

c# - Attempting to upload to FTP: System.Net.WebException: System error -

ios - UISlider customization: how to properly add shadow to custom knob image -