方法一:自己写
+function(doc,win){
var html = document.getElementsByTagName("html")[0];
reEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
reFontSize = function(){
var width = document.documentElement.clientWidth;
var fontSize = (width / 750)*100 ;
html.style.fontSize = fontSize + "px";
}
win.addEventListener(reEvt, reFontSize);
doc.addEventListener('DOMContentLoaded',reFontSize);
}(document,window)
DOMContentLoaded 等价于
$(document).ready(function() { // ...代码... });
orientationchange
方法二:运用淘宝的适配方案
https://github.com/amfe/lib-flexible
各家移动端适配在大的方向都是用的rem适配原理,但又有各自不同,像文字大小并没有用rem,而是用媒体查询来控制,有的顶部ba不管在任何吃岑的手机大小都不变,有的却不变文字大小,只变宽高。
要结合自己的页面特点选择适合自己的适配方法