I make a mobile version. There is a zoom problem. On the mobile version there is a tag:

<meta name="viewport" content="width=320" id="mobile">

The transition button is used to write a session and another one is written instead of this tag:

 <meta name="viewport" content="width=1024">

The problem is that the browser "remembers" the width of 320px and applies it; initial-scale=1 is ignored.

If you specify user-scalable=no , then everything scales correctly, but the user cannot increase it. The same effect if set minimum-scale=1,maximum-scale=1 . And it is necessary that the user could increase the part of the page

How to achieve this?

    2 answers 2

    Try adding this tag dynamically when the page loads.

     var viewPort = document.createElement('meta'); viewPort.name = "viewport"; viewPort.content = "width=1024"; document.getElementsByTagName('head')[0].appendChild(viewPort);

    Or change it:

     document.querySelector("meta[name=viewport]") .setAttribute("content", "width=1024");

    If this does not help, then it may be that in your browser, in principle, this cannot be done - the problem is known .

      You can try to change the contents of the meta tag after the zoom has become what it should be.

       window.onload = function() { setTimeout(function() { var viewport = document.getElementById('desktop'); viewport.setAttribute('content', 'width=1024'); }, 500); }; 
       <meta name="viewport" content="width=1024; user-scalable=none" id="desktop" />

      • did not help. rests on user-scalable=none , it prohibits resizing, even though the normal scale is set (and the attributes are not, the content width is understood normally), but the resize capability is needed - Maximmka
      • but the content attribute changes with width=1024; user-scalable=none width=1024; user-scalable=none at width=1024 . at least, if you run the code here, it works that way. - Sasha Omelchenko
      • I understood the logic. but it also does not work, I tried it, made the conclusion that the browser seems to take the tag settings and everything, even if you delete it (which I did) - nothing will change. - Maximmka