Make page zoom default

Asked

Viewed 2,891 times

1

Have some script that when the user opens the system the zoom is already preset when opening the page is already default ?

javascript html zoom

  • Could you elaborate a [mcve], please?

2 answers

3

Yes, and you don’t even need JS. Using HTML5:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

The initial-Scale controls the page’s initial zoom. 1.0 is 100%, 0.75 is 75% and so on. Another option is to use the property zoom of the CSS.

body {
    zoom: 2 /* Coloca o zoom em 200% */
}

  • vlw young wasn’t remembering that there

3


The metatag: <meta name="viewport" content="width=device-width, initial-scale=2.0"> not for all environments and on desktop maybe this will not work.

The estate zoom: ...; is not standard and pro this is not supported by all browsers, so run in all current browser prefer transform, thus:

#content {
    transform: scale(2.0);
    transform-origin: 0 0;
}

html:

<body>
<div id="content">
... conteudo da sua página ...
</div>
</body>

Do not apply directly on the body, this may affect some scrollbars.

If you need support for older browsers use:

#content {
    /*Safari e Chrome antigos*/
    -webkit-transform: scale(2.0);
    -webkit-transform-origin: 0 0;

    /*Firefox mais antigo*/
    -moz-transform: scale(2.0);
    -moz-transform-origin: 0 0;

    /*IE 9*/
    -ms-transform: scale(2.0);
    -ms-transform-origin: 0 0;

    /*navegadores atualizados*/
    transform: scale(2.0);
    transform-origin: 0 0;
}

Browser other questions tagged javascript html zoom

You are not signed in. Login or sign up in order to post.