Prevent mobile Browsing Click the input box to enlarge automatically

1. Set META properties

<meta content= "initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, User-scalable=no, Width=device-width" Name= "Viewport" >

Content Property Value:

Width: The range of the viewable area, the value can be a number or keyword device-width;

Height: with width;

Intial-scale: The first time the page is displayed is the zoom level of the viewable area, the value of 1.0 is displayed by the actual size, without any zoom;

maximum-scale=1.0, minimum-scale=1.0: The zoom level of the viewable area, maximum-scale the user can enlarge the page program, 1.0 will prohibit the user to enlarge to the actual size above;

User-scalable: Whether the page can be scaled, no disables scaling.

2. In order to improve the accessibility of the website in Safari, Apple blocked the User-scalable=no function under Meta. So under IOS10, even the User-scalable=no,safari browser can support manual scaling. So you can only use JS and listen to events to prevent manual scaling.

Window.onload=function() {Document.addeventlistener (' Touchstart ',function(event) {if(event.touches.length>1) {event.preventdefault (); }          })          varLasttouchend=0; Document.addeventlistener (' Touchend ',function(event) {varNow= (NewDate ()). GetTime (); if(now-lasttouchend<=300) {event.preventdefault (); } lasttouchend=Now ; },false)      } 

Prevent mobile Browsing Click the input box to enlarge automatically