精华内容
下载资源
问答
  • Videojs

    2020-12-09 01:47:33
    <p>This PR enables you to add transcript(s) to video/audio objects when using videojs viewer. <h1>What's new? <ul><li>islandora_videojs sub module which is a plugin extending ...
  • videojs

    2017-12-01 11:39:00
    DEMO地址:... https://github.com/videojs/videojs-contrib-hls 下载JS文件,直接使用 <video id=example-video width=600 height=300 class="video-js vjs-default-sk...

     

    DEMO地址:https://github.com/Tinywan/PHP_Experience

     

    https://github.com/videojs/videojs-contrib-hls

     下载JS文件,直接使用

    复制代码
    <video id=example-video width=600 height=300 class="video-js vjs-default-skin" controls>
      <source
         src="https://example.com/index.m3u8"
         type="application/x-mpegURL">
    </video>
    <script src="video.js"></script>
    <script src="videojs-contrib-hls.min.js"></script>
    <script>
    var player = videojs('example-video');
    player.play();
    </script>
    复制代码

    videojs-contrib-hls支持一堆HLS功能。以下是一些亮点:

    • 视频点播和实况播放模式
    • 备份或冗余流
    • 中段质量切换
    • AES-128段加密
    • CEA-608字幕会自动翻译成标准的HTML5 标题文字曲目
    • In-Manifest WebVTT字幕自动翻译成标准的HTML5字幕轨道
    • 定时ID3元数据将自动翻译成HTML5 metedata文本轨道
    • 高度可定制的自适应比特率选择
    • 自动带宽跟踪
    • 使用CORS支持跨域凭据
    • 与video.js的紧密集成以及使用标准HTML API尽可能多地展现的理念
    • 流多个音轨并切换到那些音轨(参见docs文件夹)获取信息
    • 片段MP4 中的媒体内容, 而不是MPEG2-TS容器格式​​。

    方法:

    获取对象

    var videoObj = videojs(“videoId”);

    ready:

    myPlayer.ready(function(){
        //在回调函数中,this代表当前播放器,
        //可以调用方法,也可以绑定事件。
    })
    

    播放:

    myPlayer.play();
    

    暂停:

    myPlayer.pause();
    

    获取播放进度:

    var whereYouAt = myPlayer.currentTime();
    

    设置播放进度:

    myPlayer.currentTime(120);
    

    视频持续时间,加载完成视频才可以知道视频时长,且在flash情况下无效

    var howLongIsThis = myPlayer.duration();
    

    缓冲,就是返回下载了多少

    var whatHasBeenBuffered = myPlayer.buffered();
    

    百分比的缓冲

    var howMuchIsDownloaded = myPlayer.bufferedPercent();
    

    声音大小(0-1之间)

    var howLoudIsIt = myPlayer.volume();
    

    设置声音大小

    myPlayer.volume(0.5);
    

    取得视频的宽度

    var howWideIsIt = myPlayer.width();
    

    设置宽度:

    myPlayer.width(640);
    

    获取高度

    var howTallIsIt = myPlayer.height();
    

    设置高度:

    myPlayer.height(480);
    

    一步到位的设置大小:

    myPlayer.size(640,480);
    

    全屏

    myPlayer.enterFullScreen();
    

    离开全屏

    myPlayer.enterFullScreen();

    添加事件

    durationchange
    ended //播放结束
    firstplay
    fullscreenchange
    loadedalldata
    loadeddata
    loadedmetadata
    loadstart
    pause //暂停
    play  //播放
    progress
    seeked
    seeking
    timeupdate
    volumechange
    waiting
    resize inherited
    
    var myFunc = function(){
    // Do something when the event is fired
    };

    事件绑定

    myPlayer.on("ended", function(){
        console.log("end", this.currentTime());
    });
    myPlayer.on("pause", function(){
        console.log("pause")
    });
    

    删除事件

    myPlayer.removeEvent(“eventName”, myFunc); 
    

    虽然文章说明在不支持html5的情况下,会以flash播放,但在支持html5的firefox下播放mp4时,却遇到很大的困难,虽然调用了flash,但一直无法播放(不过我也一直怀疑我的firefox下的flash有问题,不知道是不是真的)。不过如果你听从videojs的建议,放两个格式的视频,就不会有这个问题了。

    另外video的写法中还有专门针对flash的写法,当然你也可以用这个插件实现纯粹的flash播放(只写flash那部分就好,可以保证统一的浏览效果,不过iOS的浏览器不兼容flash,这就要你自己进行判断来处理

     

    选项参数设置


     

    如何使用,初始化

    您可以在播放器初始化时将选项对象传递给hls源处理程序。你可以像你对​​video.js的其他部分一样传递选项:

    复制代码
    // html5 for html hls
    videojs(video, {html5: {
      hls: {
        withCredentials: true
      }
    }});
    
    // or
    
    // flash for flash hls
    videojs(video, {flash: {
      hls: {
        withCredentials: true
      }
    }});
    
    // or
    
    var options = {hls: {
      withCredentials: true;
    }};
    
    videojs(video, {flash: options, html5: options});
    复制代码
    资源

    一些选项,例如withCredentials可以传递给hls player.src

    复制代码
    var player = videojs('some-video-id');
    
    player.src({
      src: 'https://d2zihajmogu5jn.cloudfront.net/bipbop-advanced/bipbop_16x9_variant.m3u8',
      type: 'application/x-mpegURL',
      withCredentials: true
    });
    复制代码

     

    直接改变URL地址:

    复制代码
        $(function () {
            $("#form_button").click(function () {
                var msg = $("#msg");
                stream_address = $('input[name="stream_address"] ').val();
                console.log(stream_address);
                if (stream_address == "") {
                    $('#stream_address ').css("border", "1px #ff0000 solid");
                    msg.text("请输入媒体流地址");
                    msg.addClass("warning");
                    return false;
                } else {
                    $('#stream_address').css("border", "1px #ff00ff solid");
                    msg.text("error");
                    msg.removeClass("warning");
                }
                $('#stream_address_code ').html("\"" + stream_address + "\"");
                player.src({
                    src:stream_address,
                    type:"application/x-mpegURL"
                });
            });
        });
    复制代码

     

    遇到的BUB、错误、解决方案!


     

    The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://127.0.0.1

    Nginx 配置文件修改跨域:

    复制代码
    location /record {
                    add_header Cache-Control no-cache;
                    add_header 'Access-Control-Allow-Origin' '*' always;
                    add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
                    add_header 'Access-Control-Allow-Headers' 'Range';
                    types{
                            application/dash+xml mpd;
                            application/vnd.apple.mpegurl m3u8;
                            video/mp2t ts;
                     }
                    alias /home/tinywan/video_recordings;
    }

    转载于:https://www.cnblogs.com/tangzp/p/7941230.html

    展开全文
  • videojs中文文档详解

    万次阅读 多人点赞 2018-07-05 10:31:23
    最近弄视频直播,网上没有全面的中文文档,只好自己整理了一份详细的api。...点此下载videojs.6.0.0 入门使用 引入video.js和video-js.css,使用video标签就像下面这样: &amp;lt;video id=&quot;e...

    最近弄视频直播,网上没有全面的中文文档,只好自己整理了一份详细的api。Video.js是一款web视频播放器,支持html5和flash两种播放方式。更有自定义皮肤,插件,组件,语言还有丰富的选项配置。

    官方网站
    下载最新版videojs

    入门使用

    查看DEMO | DEMO下载

    1. 引入video.js和video-js.css
    <link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video-js.min.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video.min.js"></script>
    
    1. 使用video标签就像下面这样:
      <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="640" height="264"
             poster="http://vjs.zencdn.net/v/oceans.png">
        <source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
      </video>
    
    1. videojs使用方式就是以类似的方式开始的,不过由于我们借助videojs对视频进行一些控制或制定
    var player = videojs('example_video_1',{
        muted: true,
    	controls : true/false,      
    	height:300, 
    	width:300,
    	loop : true,
    	// 更多配置.....
    });
    

    常用事件

    1. 播放 this.play()
    2. 停止 – video没有stop方法,可以用pause 暂停获得同样的效果
    3. 暂停 this.pause()
    4. 销毁 this.dispose()
    5. 监听 this.on(‘click‘,fn)
    6. 触发事件this.trigger(‘dispose‘)
    var options = {};
     
    var player = videojs(‘example_video_1‘, options, function onPlayerReady() {
      videojs.log(‘播放器已经准备好了!‘);
     
      // In this context, `this` is the player that was created by Video.js.<br>  // 注意,这个地方的上下文, `this` 指向的是Video.js的实例对像player
      this.play();
     
      // How about an event listener?<br>  // 如何使用事件监听?
      this.on(‘ended‘, function() {
        videojs.log(‘播放结束了!‘);
      });
    });
    

    常用选项

    autoplay : true/false 播放器准备好之后,是否自动播放 【默认false】
    controls : true/false 是否拥有控制条 【默认true】,如果设为false ,那么只能通过api进行控制了。也就是说界面上不会出现任何控制按钮
    height: 视频容器的高度,字符串或数字 单位像素 比如: height:300 or height:‘300px‘
    width: 视频容器的宽度, 字符串或数字 单位像素
    loop : true/false 视频播放结束后,是否循环播放
    muted : true/false 是否静音
    poster: 播放前显示的视频画面,播放开始之后自动移除。通常传入一个URL
    preload:预加载
    ‘auto‘ 自动
    ’metadata‘ 元数据信息 ,比如视频长度,尺寸等
    ‘none‘ 不预加载任何数据,直到用户开始播放才开始下载
    children: Array | Object 可选子组件 从基础的Component组件继承而来的子组件,数组中的顺序将影响组件的创建顺序哦。

    options 选项

    标准元素选项
    这些选项中的每一个也可用作标准元素属性 ; 因此,可以使用设置指南中列出的所有三种方式定义它们。通常,未列出默认值,因为这是留给浏览器供应商的。

    autoplay

    类型: boolean
    如果true/作为属性存在,则在播放器准备就绪时开始播放。

    注意:从iOS 10开始,Apple autoplay在Safari中提供支持。有关详细信息,请参阅“新增功能。

    controls

    类型: boolean
    确定播放器是否具有用户可以与之交互的控件。没有控件,启动视频播放的唯一方法是使用autoplay属性或通过Player API。

    height

    类型: string|number
    设置视频播放器的显示高度(以像素为单位)。

    loop

    类型: boolean
    使视频一结束就重新开始。

    muted

    类型: boolean
    默认情况下会静音任何音频。

    poster

    类型: string
    在视频开始播放之前显示的图像的URL。这通常是视频的框架或自定义标题屏幕。一旦用户点击“播放”,图像就会消失。

    preload

    类型: string
    建议浏览器是否应在加载元素后立即开始下载视频数据。支持的值是:
    ‘auto’
    立即开始加载视频(如果浏览器支持)。某些移动设备不会预加载视频,以保护用户的带宽/数据使用。这就是为什么这个价值被称为’汽车’,而不是更具决定性的东西’true’。
    这往往是最常见和推荐的值,因为它允许浏览器选择最佳行为。
    ‘metadata’
    仅加载视频的元数据,其中包括视频的持续时间和尺寸等信息。有时,元数据将通过下载几帧视频来加载。
    ‘none’
    不要预加载任何数据。浏览器将等待用户点击“播放”开始下载。

    src

    类型: string
    要嵌入的视频源的源URL。

    width

    类型: string|number
    设置视频播放器的显示宽度(以像素为单位)。

    Video.js特定的选项

    undefined除非另有说明,否则默认情况下每个选项

    aspectRatio

    类型: string
    将播放器置于流体模式,并在计算播放器的动态大小时使用该值。该值应表示比率 - 由冒号(例如"16:9"或"4:3")分隔的两个数字。

    autoSetup

    类型: boolean
    阻止播放器为具有data-setup属性的媒体元素运行autoSetup 。

    注意:必须在与videojs.options.autoSetup = falsevideojs源加载生效的同一时刻全局设置。

    children

    类型: Array|Object
    此选项继承自基Component类。

    fluid

    类型: boolean
    何时true,Video.js播放器将具有流畅的大小。换句话说,它将扩展以适应其容器。

    此外,如果元素具有"vjs-fluid",则此选项自动设置为true。

    inactivityTimeout

    类型: number
    Video.js表示用户通过"vjs-user-active"和"vjs-user-inactive"类以及"useractive"事件与玩家进行交互。

    在inactivityTimeout决定了不活动的许多毫秒声明用户闲置之前是必需的。值为0表示没有inactivityTimeout,用户永远不会被视为非活动状态。

    language

    键入:string,默认值:浏览器默认值或’en’
    与播放器中的一种可用语言匹配的语言代码。这为播放器设置了初始语言,但始终可以更改。

    在Video.js中了解有关语言的更多信息。

    languages

    类型: Object
    自定义播放器中可用的语言。此对象的键将是语言代码,值将是具有英语键和翻译值的对象。

    在Video.js中了解有关语言的更多信息

    注意:通常,不需要此选项,最好将自定义语言传递给videojs.addLanguage()所有玩家!

    nativeControlsForTouch

    类型: boolean
    明确设置关联技术选项的默认值。

    notSupportedMessage

    类型: string
    允许覆盖Video.js无法播放媒体源时显示的默认消息。

    playbackRates

    类型: Array
    严格大于0的数字数组,其中1表示常速(100%),0.5表示半速(50%),2表示双速(200%)等。如果指定,Video.js显示控件(类vjs-playback-rate)允许用户从选择数组中选择播放速度。选项以从下到上的指定顺序显示。

    例如:

    videojs('my-player', {
      playbackRates: [0.5, 1, 1.5, 2]
    });
    

    plugins

    类型: Object
    这支持在初始化播放器时使用自定义选项自动初始化插件 - 而不是要求您手动初始化它们。

    videojs('my-player', {
      plugins: {
        foo: {bar: true},
        boo: {baz: false}
      }
    });
    

    以上大致相当于:

    var player = videojs('my-player');
    
    player.foo({bar: true});
    player.boo({baz: false});
    

    虽然,由于plugins选项是对象,因此无法保证初始化顺序!

    有关Video.js插件的更多信息,请参阅插件指南。

    sources

    类型: Array

    一组对象,它们反映了本机元素具有一系列子元素的能力。这应该是带有src和type属性的对象数组。例如:

    videojs('my-player', {
      sources: [{
        src: '//path/to/video.mp4',
        type: 'video/mp4'
      }, {
        src: '//path/to/video.webm',
        type: 'video/webm'
      }]
    });
    

    使用元素将具有相同的效果:

    <video ...>
      <source src="//path/to/video.mp4" type="video/mp4">
      <source src="//path/to/video.webm" type="video/webm">
    </video>
    

    techCanOverridePoster

    类型: boolean

    使技术人员有可能覆盖玩家的海报并融入玩家的海报生命周期。当使用多个技术时,这可能很有用,每个技术都必须在播放新源时设置自己的海报。

    techOrder

    输入:Array,默认值:[‘html5’]

    定义Video.js技术首选的顺序。默认情况下,这意味着Html5首选技术。其他注册的技术将在此技术之后按其注册顺序添加。

    vtt.js

    类型: string

    允许覆盖vtt.js的默认URL,该URL可以异步加载到polyfill支持WebVTT。

    此选项将用于Video.js(即video.novtt.js)的“novtt”版本中。否则,vtt.js与Video.js捆绑在一起。

    组件选项

    Video.js播放器是一个组件。与所有组件一样,您可以定义它包含的子项,它们出现的顺序以及传递给它们的选项。

    这是一个快速参考; 因此,有关Video.js中组件的更多详细信息,请查看组件指南。

    children

    类型: Array|Object

    如果Array- 这是默认值 - 这用于确定哪些子节点(按组件名称)以及在播放器(或其他组件)上创建它们的顺序:

    // The following code creates a player with ONLY bigPlayButton and
    // controlBar child components.
    videojs('my-player', {
      children: [
        'bigPlayButton',
        'controlBar'
      ]
    });
    

    该children选项还可以作为传递Object。在这种情况下,它用于提供options任何/所有孩子,包括禁用它们false:

    // This player's ONLY child will be the controlBar. Clearly, this is not the
    // ideal method for disabling a grandchild!
    videojs('my-player', {
      children: {
        controlBar: {
          fullscreenToggle: false
        }
      }
    });
    

    ${componentName}

    类型: Object

    可以通过组件名称的低驼峰案例变体(例如controlBarfor ControlBar)为组件提供自定义选项。这些可以嵌套在孙子关系的表示中。例如,要禁用全屏控件:

    videojs('my-player', {
      controlBar: {
        fullscreenToggle: false
      }
    });
    

    技术选择

    ${techName}

    类型: Object

    Video.js回放技术(即“技术”)可以作为传递给该videojs功能的选项的一部分给予自定义选项。它们应该在技​​术名称的小写变体下传递(例如"flash"或"html5")。

    flash

    swf
    指定Video.js SWF文件在Flash技术位置的位置:

    videojs('my-player', {
      flash: {
        swf: '//path/to/videojs.swf'
      }
    });
    

    但是,更改全局默认值通常更合适:

    videojs.options.flash.swf = ‘//path/to/videojs.swf’
    html5

    nativeControlsForTouch

    类型: boolean

    只有技术支持Html5,此选项可以设置true为强制触摸设备的本机控件。

    nativeAudioTracks

    类型: boolean

    可以设置为false禁用本机音轨支持。最常用于videojs-contrib-hls。

    nativeTextTracks

    类型: boolean

    可以设置为false强制模拟文本轨道而不是本机支持。该nativeCaptions选项也存在,但只是一个别名nativeTextTracks。

    nativeVideoTracks

    类型: boolean

    可以设置为false禁用本机视频轨道支持。最常用于videojs-contrib-hls。
    .

    展开全文
  • ember-videojs-dash 灰烬+ 正在安装 ember install ember-videojs-dash
  • videojs-playlist videoJs播放器集成播放列表源码
  • videojs播放列表 videoJs播放器集成播放列表原始
  • Notice: this project will be deprecated and is succeeded by videojs-http-streaming. VHS supports HLS and DASH and is built into video.js 7, see the video.js 7 blog post video.js HLS Source Handler ...
  • <div><p>I am having some problems when trying to use videojs-markers combined with videojs-youtube. Did you tested this? Is it possible?</p><p>该提问来源于开源项目:spchuang/videojs-markers</p>...
  • videojs-master

    2016-06-12 00:28:05
    video js
  • videojs压缩包

    2019-01-30 15:38:33
    使用videojs播放rtmp实时流,videojs的压缩包附带实例,可直接使用。
  • VideoJs简介VideoJs是用于视频播放的javascript的库。使用方法var player = videojs('player', {controls: true, //掌握条:booleancontrolBar: {playToggle: {replay: false},progressControl: false}}, function ...

    VideoJs简介

    VideoJs是用于视频播放的javascript的库。

    使用方法

    var player = videojs('player', {

    controls: true, //掌握条:boolean

    controlBar: {

    playToggle: {

    replay: false

    },

    progressControl: false

    }

    }, function onPlayerReady() {

    // 修正this指向

    var vdthis = this;

    videojs.log('播放器已预备好了!');

    //this.play();

    this.on('ended', function() {

    videojs.log('播放完毕了!');

    });

    });

    经常使用设置

    Player

    ├── MediaLoader (has no DOM element)

    ├── PosterImage

    ├── TextTrackDisplay

    ├── LoadingSpinner

    ├── BigPlayButton

    ├─┬ ControlBar

    │ ├── PlayToggle

    │ ├── VolumePanel

    │ ├── CurrentTimeDisplay (hidden by default)

    │ ├── TimeDivider (hidden by default)

    │ ├── DurationDisplay (hidden by default)

    │ ├─┬ ProgressControl (hidden during live playback)

    │ │ └─┬ SeekBar

    │ │ ├── LoadProgressBar

    │ │ ├── MouseTimeDisplay

    │ │ └── PlayProgressBar

    │ ├── LiveDisplay (hidden during VOD playback)

    │ ├── RemainingTimeDisplay

    │ ├── CustomControlSpacer (has no UI)

    │ ├── PlaybackRateMenuButton (hidden, unless playback tech supports rate changes)

    │ ├── ChaptersButton (hidden, unless there are relevant tracks)

    │ ├── DescriptionsButton (hidden, unless there are relevant tracks)

    │ ├── SubtitlesButton (hidden, unless there are relevant tracks)

    │ ├── CaptionsButton (hidden, unless there are relevant tracks)

    │ ├── AudioTrackButton (hidden, unless there are relevant tracks)

    │ └── FullscreenToggle

    ├── ErrorDisplay (hidden, until there is an error)

    ├── TextTrackSettings

    └── ResizeManager (hidden)

    示例

    let player = videojs('myplayer', {

    controls: true, //启用掌握条:boolean

    controlBar: {

    // 隐蔽重播图标

    playToggle: {

    replay: false

    },

    // 竖直的音量掌握

    volumePanel: {

    inline: false

    },

    // 隐蔽播放进度掌握

    progressControl: false

    }

    });

    事宜监控

    // 播放完毕

    this.on('ended', function(e) {}

    // 播放中

    this.on('timeupdate', function(e) {}

    扩大插件

    视频列表治理 videojs-playlist

    player.playlist([{

    name: '01',

    sources: [{

    src: 'http://media.w3.org/2010/05/sintel/trailer.mp4',

    type: 'video/mp4'

    }],

    poster: 'http://media.w3.org/2010/05/sintel/poster.png'

    }, {

    name: '02',

    sources: [{

    src: 'http://media.w3.org/2010/05/bunny/trailer.mp4',

    type: 'video/mp4'

    }],

    poster: 'http://media.w3.org/2010/05/bunny/poster.png'

    }, {

    ....

    }]

    视频列表UI显现 videojs-playlist-ui

    player.playlistUi({

    el: document.getElementById('playList')

    });

    展开全文
  • VideoJs简介VideoJs是用于视频播放的javascript的库。使用方法var player = videojs('player', {controls: true, //控制条:booleancontrolBar: {playToggle: {replay: false},progressControl: false}}, function ...

    VideoJs简介

    VideoJs是用于视频播放的javascript的库。

    使用方法

    var player = videojs('player', {

    controls: true, //控制条:boolean

    controlBar: {

    playToggle: {

    replay: false

    },

    progressControl: false

    }

    }, function onPlayerReady() {

    // 修改this指向

    var vdthis = this;

    videojs.log('播放器已经准备好了!');

    //this.play();

    this.on('ended', function() {

    videojs.log('播放结束了!');

    });

    });

    常用配置

    Player

    ├── MediaLoader (has no DOM element)

    ├── PosterImage

    ├── TextTrackDisplay

    ├── LoadingSpinner

    ├── BigPlayButton

    ├─┬ ControlBar

    │ ├── PlayToggle

    │ ├── VolumePanel

    │ ├── CurrentTimeDisplay (hidden by default)

    │ ├── TimeDivider (hidden by default)

    │ ├── DurationDisplay (hidden by default)

    │ ├─┬ ProgressControl (hidden during live playback)

    │ │ └─┬ SeekBar

    │ │ ├── LoadProgressBar

    │ │ ├── MouseTimeDisplay

    │ │ └── PlayProgressBar

    │ ├── LiveDisplay (hidden during VOD playback)

    │ ├── RemainingTimeDisplay

    │ ├── CustomControlSpacer (has no UI)

    │ ├── PlaybackRateMenuButton (hidden, unless playback tech supports rate changes)

    │ ├── ChaptersButton (hidden, unless there are relevant tracks)

    │ ├── DescriptionsButton (hidden, unless there are relevant tracks)

    │ ├── SubtitlesButton (hidden, unless there are relevant tracks)

    │ ├── CaptionsButton (hidden, unless there are relevant tracks)

    │ ├── AudioTrackButton (hidden, unless there are relevant tracks)

    │ └── FullscreenToggle

    ├── ErrorDisplay (hidden, until there is an error)

    ├── TextTrackSettings

    └── ResizeManager (hidden)

    示例

    let player = videojs('myplayer', {

    controls: true, //启用控制条:boolean

    controlBar: {

    // 隐藏重播图标

    playToggle: {

    replay: false

    },

    // 竖直的音量控制

    volumePanel: {

    inline: false

    },

    // 隐藏播放进度控制

    progressControl: false

    }

    });

    事件监控

    // 播放结束

    this.on('ended', function(e) {}

    // 播放中

    this.on('timeupdate', function(e) {}

    扩展插件

    视频列表管理 videojs-playlist

    player.playlist([{

    name: '01',

    sources: [{

    src: 'http://media.w3.org/2010/05/sintel/trailer.mp4',

    type: 'video/mp4'

    }],

    poster: 'http://media.w3.org/2010/05/sintel/poster.png'

    }, {

    name: '02',

    sources: [{

    src: 'http://media.w3.org/2010/05/bunny/trailer.mp4',

    type: 'video/mp4'

    }],

    poster: 'http://media.w3.org/2010/05/bunny/poster.png'

    }, {

    ....

    }]

    视频列表UI显示 videojs-playlist-ui

    player.playlistUi({

    el: document.getElementById('playList')

    });

    展开全文
  • videojs-panorama, videojs的插件运行360度全景视频 videojs全景图一个 VideoJS和 MediaElement插件运行完整 180,360度,3d 度全景,鱼眼和 3d 鱼眼视频。 完全支持VR设备。在这里,我们将在这里发布 / videojs全景...
  • 前段时间闲来无事弄了弄video.js,感觉蛮好玩,能应用到各个应用端,自己在最后玩耍的时候,需要注意...var myPlayer = videojs('my-video');videojs("my-video", {}, function() {window.myPlayer= this;$(" #my-v...
  • Video.js WatermarkA plugin display a watermak on top of the video with Video.js.Using the PluginThe plugin automatically registers itself when you include 'videojs.watermark.js' in your page:You proba...
  • <div><p>Hello! <p>Should Video.js 5.0.2 work together with VideoJS-vimeo. I do not get out that it works. <p>Many thanks <p>ps: it works with VideoJS-youtube</p><p>该...videojs/videojs-vimeo</p></div>
  • videoJs实例

    2019-02-27 19:50:54
    移动端的视频播放,利用videojs插件相对兼容性比较好,亲测还行
  • videojs会更改你给video标签设置的id,在后面加上_html5_api,但直接用videojs对象取的时候还是用一开始定义的id网上方案1:https://blog.csdn.net/zlb_lover/article/details/71158416var myPlayer = videojs(‘my-...
  • <div><p>Trying to update a video.js project from ...<p>videojs.Dashjs = videojs.Html5.extend({ ... videojs-tech-dashjs.js (line 11) 该提问来源于开源项目:Dash-Industry-Forum/dash.js</p></div>
  • videojs所需的JS工具

    2017-03-30 16:54:50
    主要提供的是JS:videojs-contrib-hls.min.js、video.min.js、video.js、videojs-ie8.js、videojs-ie8.min.js 用于播放HLS流视频
  • <div><p>Using videojs 5.8.5 hls 2.0.1</p><p>该提问来源于开源项目:videojs/videojs-contrib-hls</p></div>
  • videojs 使用Demo

    2018-09-16 21:50:54
    videojs 使用Demo
  • I Use videojs panorama with videojs-contrib-hls. It works fine in chrome, but in firefox, the video is totally black but sound works. So to put it all together, Videojs panorama with a mp4 file as ...
  • <div><p>Based on the event propagation changes you've made starting with 2.0.0, I understand that it's expected for usual player evens to not be propagated...videojs/videojs-contrib-ads</p></div>
  • videojs object errors

    2020-11-24 19:23:26
    <div><p>I have been using this plugin for 3 years, but just recently noticed that dist/Youtube.js is throwing a lot of errors which all seem to be related to the videojs object. videojs.browser.IS_IOS...
  • videojs 6 deprication

    2020-12-02 01:06:35
    <div><p>videojs version: 6.8.0 <p>use the plugin as npm package (yarn add videojs-markers) <p>I get 2 warnings on run time: 1) videojs.plugin() is deprecated; use videojs.registerPlugin() instead 2) ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 15,075
精华内容 6,030
关键字:

videojs