VideoJS：iPad 上的视频大小

Question

我正在使用 VideoJS 来显示视频。它适用于每个系统上的所有浏览器。例外是 iPad（iOS 5 和 iOS 6，均在 Safari 和 Chrome 上测试）。视频调整为大约 300 像素宽度。

当我从页面中删除 videoJS 时，视频显示正确。但我需要 videoJS 用于换肤，因为它使 HTML5 视频在 jQuery 滑块中工作。

我尝试了几件事：

• 在 video.js 或 JS 中手动输入宽度和高度。
• 将 CSS（包括 !important）添加到视频标签，甚至是下面的所有标签（参数）。
• 尝试了一些我在 stackoverflow 上发现的模糊技术。像 -webkit-transform-style: preserve-3d;在视频标签中。
• 尝试使用 wmode。

似乎没有任何效果。有人有想法吗？

Answer 1

首先，如果您还没有升级到 5 月初（2013 年）发布的 v4.0。

在 4.0 中，您可以看到一些设置宽度高度的示例，这些示例至少适用于我的 iPad：
宽度/高度 100%：http://jsbin.com/uyelud/1/edit
宽度200px/900px（比如奇怪的尺寸）http://jsbin.com/ojajuc/2/edit

带您了解 vjs 代码...

宽度高度设置是从这里的标签中获取的： https://github.com/videojs/video.js/blob/v4.0.3/src/js/player.js#L112

从视频标签中移除（因为它被容器 div 包裹并填充容器） https://github.com/videojs/video.js/blob/v4.0.3/src/js/player.js#L144

应用于容器 div https://github.com/videojs/video.js/blob/v4.0.3/src/js/player.js#L180

然后由UI组件代码处理 https://github.com/videojs/video.js/blob/v4.0.3/src/js/component.js#L647

如果您的网页上有不同的结果，您可能需要设置reduced test case 来帮助缩小范围。