video.js使用笔记(1)

videojs github官网地址
官方文档地址

这里简单的对官方的英文参数列表做了一个简单说明，并写了一Jquery的适配调用

/** * Created by wuxp on 2017/4/26. * Jquery video */(function ($) {    if (videojs === undefined) {        console.error("请导入video.js!");        return;    }    /**     * 仅支持选择器选中的第一个元素     * @param options   videoJs配置 具体请参考 http://docs.videojs.com/tutorial-options.html     * @param ready     * @return videoJs的原生对象     */    $.fn.videoJs = function (options,ready) {        var video = this.eq(0)[0];        var player = videojs(video, options,ready);        return player;    };})(jQuery);$(document).ready(function () {        var player = $("video[data-video='example_video_1']").videoJs({            /**             * 自动播放：true/false             * 参数类型：Boolean             **/            autoplay: false,            /**             * 是否显示底部控制栏：true/false             * 参数类型：Boolean             **/            controls: true,            /**             * 视频播放器显示的宽度             * 参数类型：String|Number             * 例如：200 or "200px"             **/            width: 300,            /**             * 视频播放器显示的高度             * 参数类型：String|Number             * 例如：200 or "200px"             **/            height: 300,            /**             * 将播放器置于流体模式下，计算播放器动态大小时使用该值。             * 该值应该是比用冒号隔开的两个数字（如“16:9”或“4:3”）。             * 参数类型：String             **/            //aspectRatio:"1:1",            /**             * 是否循环播放:true/false             * 参数类型：Boolean             **/            loop: false,            /**             * 设置默认播放音频：true/false             * 参数类型：Boolean             **/            muted: false,            /**             * 建议浏览器是否在加载<video>元素时开始下载视频数据。             * 预加载:preload             * 参数类型：String             * 参数值列表：             * auto:立即加载视频（如果浏览器支持它）。一些移动设备将不会预加载视频，以保护用户的带宽/数据使用率。这就是为什么这个值被称为“自动”，而不是更确凿的东西             * metadata:只加载视频的元数据，其中包括视频的持续时间和尺寸等信息。有时，元数据会通过下载几帧视频来加载。             * none:             */            preload: "metadata",            /**             * 视频开始播放前显示的图像的URL。这通常是一个帧的视频或自定义标题屏幕。一旦用户点击“播放”图像就会消失             * 参数类型：String             **/            // poster:"",            /**             * 要嵌入的视频资源url，The source URL to a video source to embed.。             * 参数类型：String             **/            // src:"",            /**             * 此选项从组件基类继承。             * 参数类型：Array|Object             **/            //  children:[],            /**             * 是否自适应布局             * 播放器将会有流体体积。换句话说，它将缩放以适应容器。             * 如果<video>标签有“vjs-fluid”样式时，这个选项会自动设置为true。             * 参数类型：Boolean             **/            fluid: false,            /**             * 闲置超时             * 值为0表示没有             * 参数类型：Number             **/            inactivityTimeout: 0,            /**             * 语言             * 参数类型：String             * 支持的语言在lang目录下             */            language: 'zh-CN',            /**             * 语言列表             * 参数类型：Object             * 自定义播放器中可用的语言             * 注：一般情况下，这个选项是不需要的，最好是通过自定义语言videojs。addlanguage().             */            languages: "",            /**             * 是否使用浏览器原生的控件             * 参数类型：Boolean             */            nativeControlsForTouch: false,            /**             * 是否允许重写默认的消息显示出来时，video.js无法播放媒体源             * 参数类型：Boolean             */            notSupportedMessage: false,            /**             * 插件             * 参数类型：Object             */            plugins: {},            /**             * 资源排序             * 参数类型：Boolean             * 在video.js 6，这个选项将默认为true,             * videojs Flash将被要求使用Flash技术             */    //        sourceOrder:false,            /**             * 资源列表             * 参数类型：Array             *///            sources: [{//                src: '//path/to/video.flv',//                type: 'video/x-flv'//            }, {//                src: '//path/to/video.mp4',//                type: 'video/mp4'//            }, {//                src: '//path/to/video.webm',//                type: 'video/webm'//            }],            /**             * 使用播放器的顺序             * 参数类型：Array             * 下面的示例说明优先使用html5播放器，如果不支持将使用flash             */            //techOrder: ['html5', 'flash'],            /**             * 允许重写默认的URL vtt.js，可以异步加载到polyfill支持WebVTT。             * 此选项将在“novtt”建立video.js（即video。novtt js）。否则，vtt.js捆绑video.js。             * 参数类型：String             */           // "vtt.js":""        }, function () {        });        console.log(player);        console.log(player.bigPlayButton.controlTextEl_)    });

入门级别参考，更多支持可以查看官方文档。