1、移动端版本兼容 用px var jsVer = 15; var phoneWidth = parseInt(window.screen.width); var phoneScale = phoneWidth/640; 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=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">'); // andriod 2.3以上 }else{ document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">'); } // 其他系统 } else { document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">'); } //移动端版本兼容 end
2、移动端版本兼容 用rem
function rePosition(){
var width = document.documentElement.clientWidth || document.body.clientWidth;
var ratio = width/750;
if(width<=750){
document.getElementsByTagName('html')[0].style.fontSize=100*ratio+"px";
}else{
document.getElementsByTagName('html')[0].style.fontSize="100px";
}
}
rePosition();
window.onresize = function(){
rePosition();
};
//移动端版本兼容 end
3、pc端响应式:
(function (doc, win) {
var doc = doc.documentElement;
doc.addEventListener('DOMContentLoaded', Resize, false);
// 当DOM加载后执行
win.addEventListener('resize', Resize, false);
if (doc.clientWidth) {
Resize();
} else {
setTimeout(Resize, 100)
}
// 当屏幕发生变化时执行
function Resize() {
doc.style.fontSize = doc.clientWidth / 19.2 + 'px';
}
})(document, window)