使用h264 / mp4视频作为网站的背景

Question

我的客户希望将mp4视频作为整个网站的视频背景。 它已经成为一个皮塔，以确保它在我们的CMS中工作，因为他们不希望视频在转到不同的页面时重新加载。

他们发给我的文件是1080p和大约。 100MB大，2分钟长。

有什么方法可以调整视频大小/重新缩放视频并将其用作html5网站中的视频背景吗？

我应该告诉客户它不会用户友好，将是一个带宽占用，肯定会增加开发成本。

我们不会在我们的机构建立Flash网站作为一般规则，因此这不是一个选择。

Answer 1

你可以使用html5 <video>标签来播放该视频，并通过AJAX进行其余的导航。

但是你需要为不支持h264的浏览器提供不同的视频格式，比如Opera。 我推荐webm作为替代方案。

你需要缩小视频的大小，我想在质量和分辨率方面。

对于pre-html5 aera的浏览器，我建议使用静态图像;）

All-In-all：跨浏览器兼容的解决方案将是PITA。 现代浏览器具有允许这种解决方案的技术。 我想这是可能的，但你必须为大约5％的浏览器不兼容或CPU太慢的用户提供后备！

Answer 2

为了实现浏览器兼容性，您还必须将视频转换为Ogg Theora（这将减小它的大小，但它只能在WebKit / Mozilla下播放）。 HTML5视频支持缓冲，但在不同的浏览器下以不同的方式。 例如，WebKit尝试预缓冲整个视频，IE一次预先缓冲一个固定大小的块，等等。因此，这将在浏览器中执行不同的操作。

Answer 3

网站的全屏视频：查看www.gossdekort.com的源代码您甚至可以在视频上方添加菜单