The mobile page is automatically scaled by the phone screen resolution JS

<script>
var phonewidth = parseint (window.screen.width);
var phoneheight = parseint (window.screen.height);
var phonescale = phonewidth/750; Divide by value by phone's physical resolution
var ua = navigator.useragent;
if (/android (\d+\.\d+)/.test (UA)) {
var version = parsefloat (regexp.$1);
Andriod 2.3
if (Version > 2.3) {
document.write (' <meta name= ' viewport "content=" width=device-width, Minimum-scale = ' + Phonescale + ', Maximum-scale = ' + Phonescale + ', target-densitydpi=device-dpi, User-scalable=no ' > ');
Andriod 2.3 min.
} else {
document.write (' <meta name= ' viewport "content=" Width=device-width, target-densitydpi=device-dpi, user-scalable= No ">");
}
Other systems
} else {
document.write (' <meta name= ' viewport "content=" width=device-width, Minimum-scale = ' + Phonescale + ', Maximum-scale = ' + Phonescale + ', User-scalable=no, target-densitydpi=device-dpi ' > ');
}
</script>

do mobile phone page The most headache is the conversion of physical resolution and logical resolution, when the design diagram, the figure is basically in accordance with the physical resolution of the design, generally used for 640(iphone5/5s), iphone6/6s, while Google and other browsers using small mobile phone mode to browse the page, the above values for the physical resolution, debugging difficult to control the page style, On the phone side of the style will be so chaotic, in the header of the page after adding a section of JS , on the phone side can be normal display,

var phonescale = phonewidth/750;

By dividing the width of the page designed for the design,the iphone6 is designed according to its own usage requirements, which means that the page's

magnification = logical Resolution / physical resolution of the screen , so as to achieve the effect of adapting to the phone.

(Note that sometimes the page added this code in the debugging, the small phone still does not scale in this scale, but the phone is turned on is scaled, that debugging when the physical resolution value to customize the value of the logical resolution, such as to debug the style, just as the phone sees. This question I do not understand why, because occasionally in Chrome's small mobile phone that the scale of the equal proportion will be effective, most do not take effect, but also ask the great God advice)

This article is from the "Small Syria frontend" blog, please be sure to keep this source http://beileixinqing.blog.51cto.com/7540036/1880406

The mobile page is automatically scaled by the phone screen resolution JS