How do I zoom into a css or javascript page?

Asked

Viewed 2,318 times

0

I would like to know how I get the site started with 67% zoom in CSS or Javascript?

  • 3

    If your intention is to improve the display on mobile devices or in certain resolutions do not use zoom, use media query to formulate the size of your layout in a certain resolution.

  • Did you get an answer to your question?

3 answers

2

If in CSS you have the following properties:

  • zoom:

    body {
        zoom: 67%;
    }
    
  • Transform:

    body {
         transform: scale(0.67); /*0.67 equivale ao 67%*/
    }
    

Note that if you are developing a mobile page and this is your problem maybe the problem will be better solved with the <meta name="viewport">.

This way you turn off the auto zoom of mobiles and turn off the scale with touch:

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=.67, maximum-scale=1.0, user-scalable=0">

If you want to set a default scale do so (the .67 is equivalent to 67%):

<meta name="viewport" content="width=device-width, initial-scale=.67, minimum-scale=.67, maximum-scale=.67, user-scalable=0">

If you want to activate the scale do this user-scalable=1 or remove the user-scalable=1

0

That should solve:

<script type="text/javascript">
    function ajustaZoom() {
        document.body.style.zoom = "67%" 
    }
</script>


<body onload="ajustaZoom()">
</body>

0

Try this:

<script type="text/javascript">
    function zoom() {
        document.body.style.zoom = "300%" 
    }
</script>

<body onload="zoom()">
    <h6>content</h6>
</body>

Browser other questions tagged

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