禁止浏览器缩放
两个条件即可实现: 1. 动态修改html属性fontsize的值; 2. css单位统一使用rem。
1. 页面中添加如下代码:
// 定义基准字体
new function () {
var _self = this;
_self.fontSize = 100;
_self.widthProportion = function () {
_self.width =2000;
return (document.body && document.body.clientWidth || document.getElementsByTagName("html")[0].offsetWidth) / _self.width;
};
_self.changePage = function () {
document.getElementsByTagName("html")[0].setAttribute("style", "font-size:" + _self.widthProportion() * _self.fontSize + "px");
}
window.addEventListener("DOMContentLoaded", function () {
_self.changePage();
});
window.addEventListener('resize', function () {
_self.changePage();
}, false);
};
2. css单位统一使用rem,如下:
html{
/*这个是初始样式,用于js执行之前的初始大小,根据情况初始此值,保证js生效前后网页没有明显变化即可*/
font-size:38px;
}
div{
width:.3rem;
}
– end –