JS 控制VIEWPORT在微信上正常显示

经常在做移动手机网站的时候由于需要在微信平台推广我们不得不去兼容他。在IOS上由于苹果把控的很好，浏览器内核都是统一的。所以自然没有兼容问题。但是安卓就不同了，碎片化的缘故。加上微信的WEBVIEW是定制过的浏览器，导致和原生的效果不同。下面是一个兼容方案。

首先你要设置meta viewport属性。

<meta name="viewport" content="width=device-width, target-densityDpi=device-dpi, user-scalable=yes">

然后再JS代码中设置如下代码

var viewport = document.querySelector("meta[name=viewport]");
var winWidths=$(window).width();
var densityDpi=640/winWidths;
	densityDpi= densityDpi>1?300*640*densityDpi/640:densityDpi;
if(isWeixin()){
	viewport.setAttribute('content', 'width=640, target-densityDpi='+densityDpi);
}else{
	viewport.setAttribute('content', 'width=640, user-scalable=no');
	window.setTimeout(function(){
		viewport.setAttribute('content', 'width=640, user-scalable=yes');
	},1000);
}
function isWeixin(){
	var ua = navigator.userAgent.toLowerCase();
	if(ua.match(/MicroMessenger/i)=="micromessenger") {
		return true;
	} else {
		return false;
	}

快拿起安卓手机试试吧！