使用说明

npm i fit-screen

script

import { autoScale } from 'fit-screen'
const option = {
  width: 1920,
  height: 1080,
}
// 传入需要缩放的元素和宽高
// 未找到元素：在页面加载后调用或检查传入选择器是否正确
// Element not found: Call or check that the incoming selector is correct after the page has loaded
autoScale('.screen-content', option)

html

<div style="width: 100vw; height: 100vh; overflow: hidden; background-color: #09233f">
  <div class="screen-content" style="background: #09255f">
    <button>全屏切换</button>
  </div>
</div>

其他方法

import { openFullscreen, exitFullscreen } from 'fit-screen'
let isFullscreen = false
const btn = document.querySelector('button')
// 打开退出全屏 返回是否全屏
btn.addEventListener('click', () => (isFullscreen = isFullscreen ? exitFullscreen() : openFullscreen()))