CODEWITHSUNDEEP
javascriptjqueryhtml
Stuneris
Stuneris

Reputation: 77

How to auto change font size by text length

I am making buttons and have a little problem with text. I want all texts on buttons made the same width. My code:

<span class="text">SVDFBDFBSFG</span>
<br />
<span class="text">FHEWFG</span>
<br />
<span class="text">SVDFBDFBSFGSGSFBSN</span>

So texts are not the same lengths, but all buttons are the same width. I need some jQuery code to change font size by text length (then text longer - font smaller), but generated text needs to be 100px wide.

Upvotes: 0

Views: 136

Answers (2)

wasikuss
wasikuss

Reputation: 969

Here is example. changes array is for find if we oscillate around 100px. if yes, it breaks font changing function

http://jsfiddle.net/wasikuss/xbesnw93/

Upvotes: 2

user3601695
user3601695

Reputation: 26

you can get length of string with .length property.

so try this code.

$(".text").each(function(){
    var len= $(this).text().length
    var calculatedSize = //do calculate font size with length
    $(this).css("font-size", calculatedSize)
}

Upvotes: 0

Related Questions