文字内容适配
// 缩放指令
import Vue from "vue";
function transformScale(el, options) {
const { target = "width", origin = "top left" } = options;
Vue.nextTick(() => {
// 获取显示区域高宽
const width = window.innerWidth;
const height = window.innerHeight;
el.style.transformOrigin = origin;
if (target === "ratio") {
const scaleX = width / CONF.width;
const scaleY = height / CONF.height;
el.style.transform = `scaleX(${scaleX}) scaleY(${scaleY})`;
} else {
let scaleProportion = 1;
if (target === "width") {
scaleProportion = width / CONF.width;
}
if (target === "height") {
scaleProportion = height / CONF.height;
}
el.style.transform = `scale(${scaleProportion})`;
}
});
}
function inserted(el, binding) {
const options = binding.options || { passive: true };
const callback = () => transformScale(el, binding.value);
window.addEventListener("resize", callback);
callback();
el._onResize = {
callback,
options
};
}
function unbind(el) {
if (!el._onResize) {
return;
}
const { callback } = el._onResize;
window.removeEventListener("resize", callback);
delete el._onResize;
}
export const Scale = {
inserted,
unbind
};
export default Scale;
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通