jw播放器 html5,jwplayer进阶HTML5

上一篇文章写了:nginx+webpy+uswgi+jwplayer组合搭建流媒体服务器

主要是描述了整体搭建方法,以及使用jwplayer在flash方面的应用。

如果想基于HTML5做HTTP伪媒体流服务器也可以。简单的改下HTML代码即可

Loading the player ...

jwplayer("container").setup({

flashplayer: "/static/player.swf",

file: "/static/video.mp4",

height: 622,

width:1104,

stretching : 'fill',

streamer:"start",

provider:"http",

modes :[

{type:"html5"}

]

});

以上上述HTML代码配合nginx,即可实现HTML5方式。可以在chrome中做试验。但是要符合HTML5的视频格式规范,比如我这里是mp4的。

如果要实现fallback功能,即按照HTML5,flash,download的顺序进行。则HTML代码应该如下所示

modes: [

{ type: "html5" },

{ type: "flash", src: "/static/player.swf" },

{ type: "download" }

]

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML5视频播放器是一种用于在网页中播放视频的技术,它具有跨平台、无需第三方插件等优点。下面是20个常用的HTML5视频播放器及其代码: 1. Video.js播放器: 使用Video.js播放器,需要在页面头部添加相应的CSS和JS文件引用。然后,使用以下代码创建一个视频播放器: ``` <video id="my-video" class="video-js" controls preload="auto" width="640" height="264" data-setup="{}"> <source src="video.mp4" type="video/mp4"> </video> ``` 2. Plyr播放器: Plyr播放器使用简单,只需在页面头部引用Plyr的CSS和JS文件,然后使用以下代码添加一个视频播放器: ``` <video controls crossorigin playsinline> <source src="video.mp4" type="video/mp4"> </video> ``` 3. JW Player播放器JW Player是一个功能强大的HTML5视频播放器,创建一个播放器需要使用一些JS代码,如下所示: ``` <div id="player"></div> <script> var playerInstance = jwplayer("player"); playerInstance.setup({ file: "video.mp4", height: 360, width: 640 }); </script> ``` 4. MediaElement.js播放器: MediaElement.js是一个全功能的HTML5媒体播放器库。使用以下代码创建一个视频播放器: ``` <video width="640" height="360" controls> <source src="video.mp4" type="video/mp4"> </video> <script src="mediaelement-and-player.min.js"></script> ``` 其他常用的HTML5视频播放器还有DPlayer、CKPlayer、HLSPlayer等,使用方法可在官网上查找相关文档。希望以上回答对您有帮助!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值