阅读:1410回复:0
vue使页面可以自由拉伸屏幕大小,拉伸页面大小
引入screenSizeJS(js一般放在assets/js下)
// 屏幕缩放 export function screenSize(editorDom) { let screenWidth = document.body.clientWidth || document.documentElement.clientWidth; let screenHeight = document.body.clientHeight || document.documentElement.clientHeight; let defWidth = 1920; let defHeight = 1080; let xScale = screenWidth / defWidth; let yScale = screenHeight / defHeight; editorDom.style.cssText += ';transform: scale(' + xScale + ',' + yScale + ')'; $(window).resize(() => { let screenWidth = document.body.clientWidth || document.documentElement.clientWidth; let screenHeight = document.body.clientHeight || document.documentElement.clientHeight; xScale = screenWidth / defWidth; yScale = screenHeight / defHeight; editorDom.style.cssText += ';transform: scale(' + xScale + ',' + yScale + ')'; }) } 页面上引入: <div class="wrap" ref="editor">neirong</div> import { screenSize } from '@/assets/js/utils' mounted() { screenSize(this.$refs.editor); }, |
|