相助你生成全屏视频背景的超棒jQuery插件 - BigVideo.js

帮助你生成全屏视频背景的超棒jQuery插件 - BigVideo.js

日期：2012-9-5  来源：GBin1.com

在线演示 本地下载

是不是厌倦了千篇一律的图片为背景的网站，无论你怎么美化，或者是添加炫酷的特效，图片依旧是图片。永远无法让你的页面真正的活跃起来。

在今天我们介绍的这款jQuery插件 -bigvideo.js，绝对能够让你轻松的添加超棒的全屏视频背景，让你的用户体会不一样的感受。相信你们肯定会喜欢！

主要特性依赖vidoe.js，jQuery，jQuery UI 可现实展示播放视频列表能够生成自适应的视频背景如果不支持自动播放支持显示成图片如何使用

导入需要的类库：

<!-- BigVideo Dependencies --><script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script src="js/jquery-ui-1.8.22.custom.min.js"></script><script src="js/jquery.imagesloaded.min.js"></script><script src="http://vjs.zencdn.net/c/video.js"></script>

如果需要展示视频背景：

$(function() {    var BV = new $.BigVideo();    BV.init();    BV.show('http://video-js.zencoder.com/oceans-clip.mp4');});

如果需要安静的展示多个视频背景：

$(function() {    var BV = new $.BigVideo();    BV.init();    BV.show(['vid1.mp4','vid2.mp4','vid3.mp4'],{ambient:true});});

如果不支持自动播放的话，使用如下fallback，需要modernizr的支持：

var BV = new $.BigVideo();BV.init();if (Modernizr.touch) {    BV.show('video-poster.jpg');} else {    BV.show('video.mp4',{ambient:true});}

是不是很棒，希望大家有机会能够在自己的网站中应用这个插件！

来源：帮助你生成全屏视频背景的超棒jQuery插件 - BigVideo.js