分享一款html5视频背景插件

PHP中文网 JavaScript

本文摘自PHP中文网，作者V，侵删。

今天为大家分享一款非常不错的插件vidibacking，可能很多同学还不知道这款插件，下面我就来为大家简单介绍下这款插件。

vidibacking插件是一款响应式的、跨平台的html 5视频背景插件，这个插件可以让我们在页面中的，某个div后整个页面中使用html5视频作为背景。

使用方法：

使用简单，对于在<div>元素内制作视频背景效果，你只需要将video标签放在<div>元素内即可。

1

2

3

4

5

6

7

8

<div id="video-back">

  <video poster="screenshot1.jpg" autoplay muted loop class="vidbacking">

    <source src="video1.mp4" type="video/mp4">

    <source src="video1.webm" type="video/webm">

  </video>

    <!-- html content of the div -->

    <h1>Vidbacking Demo of <div> Background</h1>

</div>

下载地址 http://www.52player.cn/VideoPlayer/2018/0123488.html
演示地址 http://www.52player.cn/Demos/html5videobackgroud/

相关推荐：html5教程

以上就是分享一款html5视频背景插件的详细内容，更多文章请关注木庄网络博客！

相关阅读 >>

如何在Html中显示json数据

Html怎么隐藏控件

Html与jsp之间有什么区别

Html的<label> 标签

Html strong标签怎么用

css修改placeholder样式的方法介绍（代码示例）

Html marquee标签如何设置图片滚动？marquee标签的图片滚动代码实例

如何解决Html乱码问题

Html中图片显示方式-----img与background的区别

图文详解Html页面中添加图片的三种方法

更多相关阅读请进入《Html》频道 >>




标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...