jQuery plugin to fit text into a width/height defined element

Question

I know about fitText.js and bigText.js, but neither are meant for a multiple line headline (bigText can do multiple lines, but you have to wrap each line in a div, which won't work here). Put simply, give an <h1> with width: 200px; height: 175px; is there a jQuery plugin that will dynamically resize the text until it's all visible?

Something like this: <h1>My Short Headline</h1> would be large, but something like <h1>My Somewhat Longer Headline That Needs To Be Completely Visible With No Truncation</h1> would be quite a bit smaller. Know of anything that would do the trick?

Do you want it to wrap to the next line or all-in-one-line fit? — PhD, Oct 19 '11 at 19:55
Wrap to fill the height and width. If I wanted it on one line, fitText.js would be perfect. — bjork24, Oct 19 '11 at 19:59
What makes "rolling your own" more complicated than hunting for a plug-in? — PhD, Oct 19 '11 at 20:07

score 6 · Answer 1 · answered Oct 19 '11 at 21:01

6

Came up with my own solution: http://jsfiddle.net/bjork24/VQEC9/

Now I just need to throw it into a plugin and I'll be good to go.

answered Oct 19 '11 at 21:01

bjork24

3,153
7
35
46

3

Have you made this a plugin yet? I'd prefer downloading one than copying and implementing this. – Kevin Chavez Jan 16 '13 at 01:08
1

Would love to see this as a plugin too! – cfx Oct 15 '14 at 00:10

jQuery plugin to fit text into a width/height defined element

1 Answers1