演示

lai.yuweining.cn/404/

需要用到：vidage.css 、 vidage.js

Vidage.js 是一款移动友好的 HTML5 全屏背景视频特效插件。Vidage.js 在 Pc 上可以完美的显示视频背景，在手机或小屏幕设备（34em）显示指定的图片。

如何使用

<div class="Vidage">
    <div class="Vidage__image"></div>
    <video id="VidageVideo" class="Vidage__video" preload="metadata" loop="" autoplay="" muted="">
        <source src="video.mp4" type="video/mp4">
    </video>
</div>

加载样式

<link href="vidage.css" rel="stylesheet" />

加载脚本

 <script src="vidage.js"></script>
<script>
    new Vidage('#VidageVideo');
</script>

加载音乐 (视频使用 vidage.js 作为网页背景全屏播放的同时，视频将不会播放声音。播放声音，需要自己单独添加 audio 标签)

<audio autoplay="" loop="">
<source src="music.mp3" type="audio/mpeg">
</audio> 

项目地址：github.com/dvLden/Vidage