博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
html5视频全屏背景插件(支持全屏背景,标签实现
阅读量:2181 次
发布时间:2019-05-01

本文共 418 字,大约阅读时间需要 1 分钟。

vidbacking是一款响应式的,跨平台的html5视频背景插件。该视频背景插件允许你在页面中的某个div后整个页面中使用HTML5视频作为背景。

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

[html] 
 
  1. <div id="video-back">   
  2.   <video poster="screenshot1.jpg" autoplay muted loop class="vidbacking">   
  3.     <source src="video1.mp4" type="video/mp4">   
  4.     <source src="video1.webm" type="video/webm">   
  5.   </video>   
  6.     <!-- html content of the div -->   
  7.     <h1>Vidbacking Demo of <div> Background</h1>   
  8. </div>             

下载地址 

演示地址 

转载地址:http://bynkb.baihongyu.com/

你可能感兴趣的文章
初探Java设计模式4:一文带你掌握JDK中的设计模式
查看>>
初探Java设计模式5:一文了解Spring涉及到的9种设计模式
查看>>
Java集合详解1:一文读懂ArrayList,Vector与Stack使用方法和实现原理
查看>>
Java集合详解2:一文读懂Queue和LinkedList
查看>>
Java集合详解3:一文读懂Iterator,fail-fast机制与比较器
查看>>
Java集合详解4:一文读懂HashMap和HashTable的区别以及常见面试题
查看>>
Java集合详解5:深入理解LinkedHashMap和LRU缓存
查看>>
Java集合详解6:这次,从头到尾带你解读Java中的红黑树
查看>>
Java集合详解7:一文搞清楚HashSet,TreeSet与LinkedHashSet的异同
查看>>
Java集合详解8:Java集合类细节精讲,细节决定成败
查看>>
Java并发指南1:并发基础与Java多线程
查看>>
Java并发指南2:深入理解Java内存模型JMM
查看>>
Java并发指南3:并发三大问题与volatile关键字,CAS操作
查看>>
Java并发指南4:Java中的锁 Lock和synchronized
查看>>
Java并发指南5:JMM中的final关键字解析
查看>>
Java并发指南6:Java内存模型JMM总结
查看>>
Java并发指南7:JUC的核心类AQS详解
查看>>
Java并发指南8:AQS中的公平锁与非公平锁,Condtion
查看>>
Java网络编程和NIO详解6:Linux epoll实现原理详解
查看>>
Java网络编程和NIO详解7:浅谈 Linux 中NIO Selector 的实现原理
查看>>