0

When you surf with your browser, you can increase or decrease the font dimension by pressing CTRL + + or CTRL + -.

Is there a way to simulate this operation by code (like javascript)?

I have to put a couple of button on my site to increase or decrease the size but to make it, I have to change dynamically a lot of font-size properties (BODY, INPUT, OPTIONS etc...)

JNYRanger
  • 6,626
  • 12
  • 55
  • 77
MrMime
  • 605
  • 4
  • 10
  • 24

1 Answers1

4

Don't do this. Browser zoom is a feature that:

  • may or may not be present in a browser,
  • is implemented in different ways through browsers,
  • only exists as a last-resort plumbing for bad websites.

a couple of button on my site to increase or decrease the size but to make it, I have to change dinamically a lot of font-size properties

What you really want to do is:

  • Scale your fonts in relative units (like em or %) everywhere,
  • Change document.body.style.fontSize to modify your base size (which other elements will use as their base size).

Specify the body's font size in relative units too - In this way you can also respect the user's system settings (which every decent website should do).

There's plenty of resources on CSS font scaling around. Here's one:

http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/

Kos
  • 67,875
  • 23
  • 165
  • 229
  • There is also a solution called "responsive design", which adapts to the cbrowsers better than just using relative units. – Tadeck Jun 21 '12 at 07:44
  • AFAIK "responsive design" is about having (mainly) the layout adapt to the device (w/r/t the screen size, etc). These two sure can be used togehter – Kos Jun 21 '12 at 07:56