Javascript resize text as an image

views:

answers:

Javascript resize text as an image

Hi,

I was wondering how to resize a div containing some text by setting a width and height so it would stretch to fill that area like an tag? E.g. when you set the width and height attribute of an image, it resizes the image to fill that area. I need to take an arbitrary width and height value and stretch a div containing text to those dimensions. I do not wish to send a request to a php script to build an image containing the text since it will be slow and affect the scalability of the web app. Oh, and I would preferably not like to use html5 because it is a requisite that I need compatibility with ie7+ (and firefox/chrome).

Thanks.

Ok, Here is how to do that.

http://www.jsfiddle.net/Zp8AH/

However, some factors like Font Family, Division width have to be fixed, in order for this code to work.

Starx 2010-10-24 12:28:35

How will `animate()` help determine the correct font size needed to fit a certain string to a specific width or height? The demo used there animates to a *font size* and a container width, but the text is not stretched to fill the container.

Pekka 2010-10-24 12:29:37

You have yourself given the answer to this problem in your comment `so you will have to calculate the correct font size for a given string, and a given pixel width or height`

Starx 2010-10-24 12:35:46

Just to make things clearer, I need to take an arbitrary width AND height and resize the text somehow to fit the container. Setting the font size appropriately is a matter of selecting either the width OR the height, something that I cannot do.

Andrew Jones 2010-10-24 12:47:52

ansaurus

tags:

views:

answers:

Javascript resize text as an image

related questions