Video.js 测试成功
中文使用说明： http://www.cnblogs.com/afrog/p/4115377.html
HTML5视频播放器Video.Js的使用 http://coderlt.coding.me/2016/02/26/videojs-readme/
官方： https://github.com/videojs/videojs-contrib-hls#installation
|
1 2 3 4 5 6 7 8 |
<link rel="stylesheet" type="text/css" href="<c:url value="/script/plugins/player/video-js/video-js.css" />?pv=<%=ProjectUtil.getBuildTime()%>"> <script type="text/javascript" src='<c:url value="/script/plugins/player/video-js/video.js"/>?pv=<%=ProjectUtil.getBuildTime()%>'></script> <script type="text/javascript" src='<c:url value="/script/plugins/player/video-js/lang/zh-CN.js"/>?pv=<%=ProjectUtil.getBuildTime()%>'></script> <script type="text/javascript" src='<c:url value="/script/plugins/player/video-js-contrib-hls/videojs-contrib-hls.js"/>?pv=<%=ProjectUtil.getBuildTime()%>'></script> |
移动端:
|
1 2 3 4 |
<video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268" data-setup='{}' x5-playsinline="true" playsinline="true" webkit-playsinline="true" x5-video-player-fullscreen="true" webkit-inline="true" x-webkit-airplay="allow"> <source src="http://ivi.bupt.edu.cn/hls/cctv1hd.m3u8" type="application/x-mpegURL"> </video> |
PC端:
|
1 2 3 4 |
<video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268" data-setup='{}'> <source src="http://ivi.bupt.edu.cn/hls/cctv1hd.m3u8" type="application/x-mpegURL"> </video> |
MediaElement.js
http://www.mediaelementjs.com/
|
1 2 3 4 5 6 7 8 |
<link rel="stylesheet" type="text/css" href="<c:url value="/script/plugins/player/mediaelement/build/mediaelementplayer.css" />?pv=<%=ProjectUtil.getBuildTime()%>"> <script type="text/javascript" src='<c:url value="/script/plugins/player/mediaelement/build/mediaelement-and-player.js"/>?pv=<%=ProjectUtil.getBuildTime()%>'></script> <script type="text/javascript" src='<c:url value="/script/plugins/player/mediaelement/build/lang/zh-cn.js"/>?pv=<%=ProjectUtil.getBuildTime()%>'></script> <script type="text/javascript" src='<c:url value="/script/plugins/player/mediaelement/build/renderers/vimeo.js"/>?pv=<%=ProjectUtil.getBuildTime()%>'></script> |
|
1 2 3 |
<video width="320" height="240" controls preload="auto" autoplay> <source type="application/x-mpegURL" src="http://www.streambox.fr/playlists/test_001/stream.m3u8" /> </video> |
|
1 2 3 4 5 6 7 8 |
$('video').mediaelementplayer({ // Do not forget to put a final slash (/) pluginPath: 'https://cdnjs.com/libraries/mediaelement/', // this will allow the CDN to use Flash without restrictions // (by default, this is set as `sameDomain`) shimScriptAccess: 'always' // more configuration }); |
