wake-up-neo.com

Viewport-Meta-Tag funktioniert in iPhone und Android nicht

Ich verwende den folgenden HTML-Code

<!DOCTYPE HTML>
  <html>
    <head>
     <title>test</title>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    </head>
    <body>
    test
    </body>
  </html>

Ich möchte verhindern, dass der Benutzer die Ansicht vergrößert oder verkleinert. Der obige Code funktioniert nicht auf iPhone und Android. Irgendeine Lösungsmöglichkeit ?

EDIT: Wird in den iPhone-Einstellungen angezeigt. Wenn Zoom als On unter Settings>Accessibility>Zoom ausgewählt ist, überschreibt dies das Meta-Tag. Quelle

Nicht sicher, warum es in Android passiert.

androidiphonehtmlmeta-tagsviewport
17
Prabhat

Ich verwende dieses Tag, um das Zoomen auf allen mobilen Plattformen zu verhindern:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densityDpi=device-dpi" />

Mit , und nicht ;

6
ChristopheCVB

In meinem Teil habe ich diesen "Viewport", der auf einem Android (Nexus 5) und auf dem iPhone gut funktioniert.

<meta name="viewport" content="width=device-width; initial-scale=0.5, maximum-scale=0.5, minimum-scale=0.5; " />

Ich hoffe das hilft dir!

4
Joffrey Outtier

Setzen Sie dieses Skript ein, um das Zoomen durch Quetschen zu vermeiden. in der neuesten Safari-Version, wenn das Meta-Tag nicht funktioniert

   document.documentElement.addEventListener('touchstart', function(event) {
     if (event.touches.length > 1) {
       event.preventDefault();
     }
   }, false);
2
neel upadhyay
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width; height=device-height" />

funktionierte gut auf Samsung Galaxy S3

1
Adam Rifai

Es scheint, dass es im normalen iOS (11.3) Browser nicht mehr funktioniert. 

Es hat jedoch immer noch Auswirkungen auf die Webseite, wenn diese zum Startbildschirm hinzugefügt und von dort aus gestartet wird.

Wenn Sie also das Freigabemenü berühren, wählen Sie "Zum Startbildschirm hinzufügen" und öffnen Sie es von dort aus, so dass Sie nicht wie erwartet zoomen können:

<meta charset="utf-8" />
<title>luckydonald/SelfhostedMouse</title>
<meta name="Apple-mobile-web-app-title" content="SelfhostedMouse" />
<meta name="Apple-mobile-web-app-capable" content="yes" />
<meta name="Apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="viewport" content="user-scalable=no; width=device-width; initial-scale=1.0; minimum-scale=1.0; maximum-scale=1.0">
1
luckydonald

Einige Zeit müssen Sie -webkit-flex: 1 zu Containern hinzufügen (falls Flexbox natürlich verwendet wird). Das hat mir bei meinem Viewport-Problem geholfen.

0
Anton Golova