检测纵横比 - HTML5 视频

Posted

技术标签:

【中文标题】检测纵横比 - HTML5 视频【英文标题】:Detect aspect ratio - HTML5 video 【发布时间】:2013-02-01 00:19:45 【问题描述】:

是否可以检测 html5 视频元素的纵横比?

我知道视频只会缩小以适应 <video> 元素的尺寸,但我想检测源视频的纵横比。

这样你就可以去除任何黑条。

对不起,我在其他任何地方都没有看到这个答案。

【问题讨论】:

HTML5 Video Dimensions的可能重复 【参考方案1】:

从另一个 *** 答案粘贴: https://***.com/a/4129189/1353189

<video id="foo" src="foo.mp4"></video>

var vid = document.getElementById("foo");
vid.videoHeight; // returns the intrinsic height of the video
vid.videoWidth; // returns the intrinsic width of the video

来源(HTML5 规范):http://www.w3.org/TR/html5/video.html#video

然后您可以通过将宽度除以高度来计算纵横比。

【讨论】:

以上是关于检测纵横比 - HTML5 视频的主要内容,如果未能解决你的问题,请参考以下文章

缩放 HTML5 视频并打破纵横比以填充整个站点

iPad/iphone 上的 HTML5 视频背景

以视频的纵横比在纹理视图上播放视频

iOS Swift - 如何获取本地和远程视频的纵横比?

确保相机预览大小/纵横比与生成的视频相匹配

无中断纵横比的全屏视频