如何使iPad上HTML5视频侧面的黑条消失?

时间:2012-08-07 16:01:59

标签: ipad html5 video size mobile-safari

我正在开发一款主要在iPad上运行的WebApp。该应用程序可播放多个视频,并具有一些交互式组件。

我的问题是化妆品:即使HTML5视频标签工作正常,我创建的自定义控件控制视频/音频播放就好了,对于我的生活我无法弄清楚如何制作黑色视频一侧的条形图消失。

嵌入是完全标准的:

<video id="video" src="./video/video.mp4" width="1024"></video>    

我只是希望该死的视频与iPad屏幕一样宽,但无论我指定的尺寸如何,侧面总会有黑条。我找到的唯一解决方法是超大视频,然后给它一个负余量,以便它居中,但肯定必须有一个更好的解决方案...特别是因为黑色不需要的“边距”的宽度不是恒定的根据视频的指定宽度进行更改。以前有人遇到过同样的问题吗?任何想法或帮助将不胜感激。谢谢大家。

1 个答案:

答案 0 :(得分:4)

感谢您的投入。原来我必须指定视频元素的高度,因为某些原因iPad上的Safari不能正确缩放视频和控件;一旦我在实际视频标签中明确指定了16:9的像素,      在HTML文件中,条形图消失了。