软件 聊天 安全 视频 浏览器 下载 系统 办公 教学 输入法
免费 域名 空间 相册 邮箱 资源 网赚 试用 优惠 工具
教程 设计 三维 学院 办公 网页
素材 PSD 矢量 网页 PPT 动画
美女 唯美 大生活 美图 风景 时尚艺
资讯 新闻 专题 热点
您的位置: 广信之家 > 免费资源 > 免费插件 > 文章正文

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

时间:09-13 14:53 来源:gbin1.com 整理:广信小编 我要评论(0)
字号:T|T
内容提要:
  是不是厌倦了千篇一律的图片为背景的网站,无论你怎么美化,或者是添加炫酷的特效,图片依旧是图片。永远无法让你的页面真正的活跃起来。在今天我们介绍的这款jQuery插件 -

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

在线演示  本地下载

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

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

主要特性

1.依赖vidoe.js,jQuery,jQuery UI

2.可现实展示播放视频列表

3.能够生成自适应的视频背景

4.如果不支持自动播放支持显示成图片

如何使用

导入需要的类库:

<!-- 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

    相关阅读:

    顶一下
    (0)
    0%
    踩一下
    (0)
    0%
    免责申明:以上内容仅代表原创者观点,其内容未经本站证实,帮助你生成全屏视频背景的超棒jQuery插件 BigVideo.js对以上内容的真实性、完整性不作任何保证或承诺,转载目的在于传递更多信息,由此产生的后果与帮助你生成全屏视频背景的超棒jQuery插件 BigVideo.js无关;如以上转载内容不慎侵犯了您的权益,请联系我们将会及时处理。
    [责任编辑:广信小编]

    精彩图文

    登录 (请登录发言,并遵守 相关规定)
    如果你对广信之家有任何意见或建议,请到交流平台反馈。到留言板反馈