分享一款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怎样把div放在底部

Html页面底部多出很多空白部分是什么原因

Html怎么禁止文本

div和span的区别是什么

Html中如何建立超链接

Html文字怎么换行

Html网页选择使用哪种浏览器内核渲染的方法

Html thead标签怎么用

在Html元素中如何嵌入图像

Html中怎么加img路径

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




标签：

打赏

取消

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

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

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

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

相关推荐

评论

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