EasyNVR H5无插件摄像机直播解决方案前端解析之:videojs的使用

video.js的基本使用方法


1、videojs的初始化加载

videojs初始化加载分为两中bash

1.标签式加载

在引入videojs加载文件的前提下,能够在video标签中添加属性值“data-setup=’{}’”,而且在class属性中添加“video-js”;两者缺一不可;markdown

<video class="video-js vjs-default-skin" data-setup='{}'>

“vjs-default-skin”是加载出来播放器默认样式;网络

2.JS加载

经过js进行加载不须要在video标签中添加“data-setup=’{}’”,能够经过js来初始化videojs;ide

var player = videojs('video');

若是须要加载多个播放器,能够根据标签中的id属性来进行播放器的加载。spa

player = videojs("player" + i, {
                            techOrder: ["flash"],
                            autoplay: true
                        });

效果以下:code

EasyNVR

2、videojs基本样式的调整

videojs加载成功后默认播放按钮是出如今播放器左上角的,为了让播放按钮默认居中显示能够经过给video标签添加class属性值“vjs-big-play-centered”视频

<video class="video-js vjs-default-skin vjs-big-play-centered" data-setup='{}'>

效果以下:get

EasyNVR

关于EasyNVR

EasyNVR可以经过简单的网络摄像机通道配置,将传统监控行业里面的高清网络摄像机IP Camera、NVR等具备RTSP协议输出的设备接入到EasyNVR,EasyNVR可以将这些视频源的音视频数据进行拉取,转换为RTMP/HLS,进行全平台终端H5直播(Web、Android、iOS),而且EasyNVR可以将视频源的直播数据对接到第三方CDN网络,实现互联网级别的直播分发;直播

详细说明:http://www.easydarwin.org/easynvr/string

获取更多信息

邮件:support@easydarwin.org

WEB:www.EasyDarwin.org

Copyright © EasyDarwin.org 2012-2017

EasyDarwin

相关文章
相关标签/搜索