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

使用下面的代码作为页面的全屏视频背景的 HTML 代码

<div class="vidage">
  <video id="vidage" class="vidage-video" preload="metadata" loop autoplay muted>
    <source src="videos/bg.webm" type="video/webm">
    <source src="videos/bg.mp4" type="video/mp4">
  </video>
</div>

设置和导入所需的样式 

// set the fallback-cover image
$vdg-fallback-image: url('../images/fallback.jpg');

// import package
@import '~vidage/src/styles/vidage';

导入JS模块并创建新实例  

import Vidage from 'vidage'

new Vidage('#vidage')

链接: https://fly63.com/nav/1460