let resize = () => {
let myW = 1920 // 设计稿
let myH = 1080 // 设计稿
let stageW = document.documentElement.clientWidth // 窗口宽度
let stageH = document.documentElement.clientHeight // 窗口高度
let scale = (stageH / myH < stageW / myW) ? (stageH / myH) : (stageW / myW);
scale = scale;
let x = ((stageW - myW * scale) * .5) / scale;
let y = ((stageH - myH * scale) * .5) / scale;
// console.log(scale,x,y)
let vueapp = document.getElementById('app')
vueapp.style.transform = `scale(${scale}) translate(${x}px,${y}px)`
vueapp.style.transformOrigin = `0 0`
}
resize();
window.addEventListener('resize', () => {
resize();
});
}
适配外部容器,让项目无论如何缩放都保持一定的比例
最新推荐文章于 2024-05-16 21:44:33 发布