视频纵横比在 firefox 网络浏览器上自动更改

Posted 2023-03-17

【中文标题】视频纵横比在 firefox 网络浏览器上自动更改

【英文标题】：Video aspect ratio changes automatically on the firefox web browser

【发布时间】：2022-01-21 20:55:44

【问题描述】：

我正在做一个项目，我正在使用 javascript 访问摄像头，并且摄像头的纵横比在 CHROME 上运行良好，但是当我在 Firefox 浏览器上对其进行测试时，它会自动更改纵横比

这是一个 CHROME 结果

和 FIREFOX 结果

还有我的代码 <video id="video" width="280px" height="480px"></video>

const videoElement = document.getElementById("video");
const camera = new Camera(videoElement, 
  onFrame: async () => 
    await model.send( image: videoElement );
  ,
  width: 280,
  height: 480,
);
camera.start();

如果有人可以帮助我，请告诉我

【参考方案1】：

您是否尝试过设置 CSS 纵横比属性？不确定这对您的情况是否有意义，只是一个想法。 https://developer.mozilla.org/en-US/docs/Web/CSS/aspect-ratio

【讨论】：

我已经添加了自己的 CSS，但仍然没有得到结果

【参考方案2】：

更新

-我在我的视频 ID 中找到了答案，我只需要添加这个 CSS 属性 object-fit: cover