Skip to content

jQuery Plugin to simulate browser page zoom/text zoom? – Stack Overflow

October 21, 2011

If you’re looking for text zoom, the easiest way to do it would be to specify the base font size on your body in an absolute unit, e.g. body { font-size: 13pt; } and then make everything else use relative units, e.g. .postTitle { font-size: 120%; }.

Then, if you have +/- zoom links or whatnot:

$(‘#enlargeText’).click(function () {

$(document.body).css(‘font-size’, $(document.body).css(‘font-size’) * 1.5);

}

This will increase all font sizes that are relative to body.

However, if you want to simulate page zoom (as opposed to text zoom), you would also have to either specify image dimensions in relative units, or loop through all images and resize them accordingly:

$(‘#enlargeText’).click(function () {

$(‘img’).each(function () {

this.width *= 1.5;

})

}

But then you are still stuck with the CSS background images, which have not been resized. AFAIK, that is only possible using CSS 3 that is not widely supported, or by having resized versions of all those images on the server. You could then simply activate a new stylesheet that references those bigger/smaller images.

via jQuery Plugin to simulate browser page zoom/text zoom? – Stack Overflow.

Advertisements

From → Uncategorized

Leave a Comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: