javascript page zoom

Question

Hi i develop my web site and i want to make two buttons (+ and -) with functions of ctr+ and ctr- for zoom in and zoom out of whole web page in all browsers. I need javascript code for this purpose Can anybody help?

As you pointed out, browsers have this feature built in. Why do you feel the need to simulate it with a UI that users' won't be familier with? — Quentin, May 12 '11 at 11:52
Similar question: http://stackoverflow.com/questions/2578354/access-browsers-page-zoom-controls-with-javascript — stivlo, May 12 '11 at 11:58

score 1 · Answer 1 · answered Sep 20 '15 at 08:06

I hope this helps you ! This will zoom the entire body tag

var currentZoom = 100;
function zoom(paramvar)
{
  currentZoom += paramvar;
  document.body.style.zoom =  currentZoom + "%" 
}

<button onclick="zoom(+10);">Zoom In</button>
<button onclick="zoom(-10);">Zoom Out</button>

score 0 · Answer 2 · answered Dec 21 '15 at 09:57

0

you can use

document.body.style.zoom

also in CSS :

element{zoom:<value>;}

answered Dec 21 '15 at 09:57

Pedram Parsa

1
1

Deepu S Nath · Answer 3 · 2011-05-12T13:29:37.303

0

You have apply a logic to retain the current zoom size and increment/decrement parameter to find the required width. You can customize the following function as per your requirement.

function zoom()
{
var wdth = 1024; //Change this variable to match your configuration
document.body.style.zoom = screen.width/1024;
document.Fm.TxAre.value=1024;
alert("1024 ? : "+screen.width/1024);
}

This is just a quick solution. There are lot of better options available in the web. Just thought of sharing an easy method without using third party solution.

edited May 12 '11 at 13:29

answered May 12 '11 at 12:09

Deepu S Nath

1,164
1
17
45

Isn't `zoom` non-standard and poorly supported? – Quentin May 12 '11 at 12:10

javascript page zoom

3 Answers3

Linked