计算缩放值以转换iframe以使其适合视口中的内容

Question

正确，我有这种逻辑可以用vimeo视频缩放ifrime，但这并不完美：

const w = window.innerWidth
const h = window.innerHeight
const ratioVideo = 640 / 360
const ratioScreen = w / h

const calculatedRatio = ratioVideo / ratioScreen
const minRatio = 1.45

scaleVideo = calculatedRatio > minRatio ? calculatedRatio : minRatio

然后我有：

<iframe style="`transform:scale(${scaleVideo})`"..>

但是它不会完全填满视口，特别是当视口比例小于1（宽度比高度大）时>]

如何为每种分辨率进行正确的计算？我找不到钥匙

[我知道我有这种逻辑来用vimeo视频缩放ifrime，但这并不完美：const w = window.innerWidth const h = window.innerHeight const ratioVideo = 640/360 const ratioScreen = w / ...

Answer 1

我只使用CSS，使用Flexbox将iframe居中，并使用mediaquery来检查aspect-ratio：