海外CN2直连服务器
腾讯云优惠|主机测评网!

JS页面缩放解决不同设备的自适应问题

Web网页重构中不同屏幕自适应展现出同样的效果一直是开发者比较烦恼的问题,本文将通过原生JavaScript代码通过页面缩放zoom来解决自适应问题。

以1920的屏幕宽为例,如果设计稿不一样可以自行修改。

function bodyScale() {
    var devicewidth = document.documentElement.clientWidth;
    var scale = devicewidth / 1920;  // 设计稿的尺寸宽度
    document.body.style.zoom = scale;
}
window.onload = window.onresize = function () {
    bodyScale();
};

了解更多前端开发知识,请收藏本站~

赞(0)
未经允许不得转载:雪花测评 » JS页面缩放解决不同设备的自适应问题
分享到: 更多 (0)

国内建站推荐腾讯云轻量级应用服务器,开箱即用。最新活动:点我进入