CODEWITHSUNDEEP
javascriptjqueryhtmlcanvashtml5-canvas
larin555
larin555

Reputation: 1689

Stretch Text ... if length is higher than 10 in Html5 Canvas

I am working with HTML5 Canvas lately. Here's my JSFiddle :

http://jsfiddle.net/fknjz/17/

And here's what I have found that could be useful :

http://www.mono-software.com/blog/post/Mono/145/jQuery-dynamic-text-sizing/

I need something like this :

If document.getElementById("nom").value.length > 10...then the text value would stretch -5% each time a letter is typed...so the text will start to shrink (only the width) if there's more than 10 letters typed in the textbox in the Canvas.

Does anyone knows how I could make this work?

Thank you!

Upvotes: 4

Views: 484

Answers (1)

sactor
sactor

Reputation: 278

I'm not 100% sure if this is what you are even after, since the question is kind of vague, but did you know there is a fourth parameter for fillText? It fits the text to a maximum width. I updated your jsFiddle here http://jsfiddle.net/fknjz/32/.

I also added clearRect to clear the areas under the texts so you can update the view without making a mess.

Upvotes: 6

Related Questions