【问题标题】:HTML5 video is the wrong size on iPadiPad 上的 HTML5 视频尺寸错误
【发布时间】:2012-10-16 16:23:37
【问题描述】:

我构建了一个由 HTML5 视频组成的交互式游戏,有时在其上添加可点击的 png 层以增加交互性。

它非常简单,在 Chrome/Firefox 上运行良好,但我试图让它在 iPad 上运行,但我遇到了一个问题:无论我在 CSS 或 <video> 标签中放置的大小,视频在 iPad 上显示更小。

我正在使用 VideoJS 来管理 HTML5 视频的事件。

您可以在http://megalobio.com 进行测试。它是法语,但很容易理解,只需 Facebook 登录即可打开游戏(不保存数据,仅用于游戏构建目的)。

我迫切需要一些帮助,这让我忙了好几天......

【问题讨论】:

  • 你解决了吗?
  • @mat 是的,iPad 选择了一种转换错误的格式,即 .ogv。
  • 好的.. 我的格式很好,可以在任何地方使用。但是 MP4 可以在带有 VideoJS 的 iPad 上正确显示,而没有 VideoJS 则很好
  • 如果您查看代码,您会看到视频标签widthheight 属性在播放器初始化时被替换为空。我的解决方法是像这样使用 css 为元素设置值。 .vjs-tech {width: 900px; height: 506px;}希望这会有所帮助。 :)

标签: ipad html5-video


【解决方案1】:

您可以通过设置正确的viewport meta tag 来避免这种情况

尝试在您的

中添加此行
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

您可能还想根据device orientation更改值

另一个推荐阅读here

【讨论】:

  • 不工作,当我设置视口时,窗口非常适合,但视频在 div 块内,并且仍然太小而无法容纳块......还有其他想法吗?
猜你喜欢
  • 1970-01-01
  • 2011-05-06
  • 1970-01-01
  • 2017-01-12
  • 2011-02-23
  • 2021-01-18
  • 1970-01-01
  • 2015-12-06
  • 1970-01-01
相关资源
最近更新 更多