支持：
- youtube.com以及youtu.be
- 常规网址：http：//www.youtube.com/watch？v = xjS6SftYQaQ
- 嵌入式网址：http：//www.youtube.com/embed/xjS6SftYQaQ
- 播放列表网址：http：//www.youtube.com/playlist?list = PLA60DCEB33156E51F或http://www.youtube.com/watch?v=xjS6SftYQaQ&list=SPA60DCEB33156E51F
上代码：
<!DOCTYPE html>
<html>
<head>
<link href="css/video-js-cdn.css" rel="stylesheet">
<script type="text/javascript" src="js/app/jquery-3.1.1.min.js" ></script>
<script src="js/app/video.min.js"></script>
<script src="js/app/Youtube.js"></script>
</head>
<style>
body{
margin: 0;
}
#vid1{
width: 100%;
height: 100vh;
}
.vjs-default-skin .vjs-big-play-button {
display: none;
}
</style>
<body>
<video id="vid1" class="video-js vjs-default-skin" autoplay controls webkit-playsinline playsinline></video>
</body>
<script>
/*获取视频，创建播放器*/
var urldata = "https://www.youtube.com/watch?v=xjS6SftYQaQ";;
var player = videojs('vid1',{
techOrder:["youtube"],
sources: [{
type: "video/youtube",
src: urldata
}],
youtube: {playlist: "2_HXUhShhmY,lLJf9qJHR3E"},
loop:true,//循环播放
autoplay:true,//自动播放
playsinline: 1,//禁止在IOS app 上自动全屏
muted: false
}, function onPlayerReady() {
this.play();
});
/*关闭*/
function onVideoStop(){
$("body").html('<video id="vid1" class="video-js vjs-default-skin" autoplay controls webkit-playsinline playsinline></video>')
}
</script>
</html>说明： 关于IOS app上自动全屏，请把参数playsinline 设为1，另外Obj-C 设置：webview.allowsInlineMediaPlayback = YES;
286
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
