原理:
屏幕要么宽度超出,要么高度超出,通过计算得出是那个超出,按照超出那个计算缩放比例,进行缩放。
但是不知道为什么100%的时候宽度高度都填充不满!!!??
mounted 和函数setLayout写法:
setLayout() {
let designWidth = 1746; //设计稿的宽度,根据实际项目调整
let designHeight = 950; //设计稿的高度,根据实际项目调整
// 自适应分两种情况 1、宽度不够 2、高度不够
let ratio =
document.documentElement.clientWidth /
document.documentElement.clientHeight <
designWidth / designHeight;
let scale = ratio
? document.documentElement.clientHeight / designHeight
: document.documentElement.clientWidth / designWidth;
console.log(document.documentElement.clientHeight);
let a =
scale > 1
? 1
: (document.querySelector(
"#iocp"
).style.transform = `scale(${scale})`);
// 设置缩放中心为上边中间
do