<html lang="en"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="author" content="monicaqin">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>测试视频test</title>
</head>
<body>
<div>
<video id="test_video" src="movie/luyu.mp4" controls="controls" x5-video-player-type="h5" x5-video-player-fullscreen="true" autoplay="" style="width: 1536px; height: 100%; display: block;"></video>
</div>
<div style="position:relative;top:-100px;">
<input value="竖屏播放" οnclick="portrait();" type="button">
<input value="横屏播放" οnclick="landscape();" type="button">
<input value="跟随旋转" οnclick="autoOrientation();" type="button">
</div>
<script type="text/javascript">
test_video.style.width = screen.width + "px";
test_video.style.height = "100%";
</script>
<div>
<canvas id="test">
</canvas></div>
<script type="text/javascript">
window.οnresize=function(){
//alert("haha");
test_video.style.width = screen.width;
test_video.style.height = screen.height;
}
test_video.addEventListener("timeupdate", function(){
if(test_video.currentTime > 2)
{
test_video.style.display = 'block';
}
});
function testPlay(){
test_video.play();
}
window.οnresize=function(){
//alert("haha");
test_video.style.width = screen.width;
test_video.style.height = screen.height;
}
function portrait(){
test_video.setAttribute("x5-video-orientation", "portrait");
}
function landscape(){
test_video.setAttribute("x5-video-orientation", "landscape");
}
function autoOrientation(){
test_video.setAttribute("x5-video-orientation", "landscape|portrait")
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="author" content="monicaqin">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title>测试视频test</title>
</head>
<body>
<div>
<video id="test_video" src="movie/luyu.mp4" controls="controls" x5-video-player-type="h5" x5-video-player-fullscreen="true" autoplay="" style="width: 1536px; height: 100%; display: block;"></video>
</div>
<div style="position:relative;top:-100px;">
<input value="竖屏播放" οnclick="portrait();" type="button">
<input value="横屏播放" οnclick="landscape();" type="button">
<input value="跟随旋转" οnclick="autoOrientation();" type="button">
</div>
<script type="text/javascript">
test_video.style.width = screen.width + "px";
test_video.style.height = "100%";
</script>
<div>
<canvas id="test">
</canvas></div>
<script type="text/javascript">
window.οnresize=function(){
//alert("haha");
test_video.style.width = screen.width;
test_video.style.height = screen.height;
}
test_video.addEventListener("timeupdate", function(){
if(test_video.currentTime > 2)
{
test_video.style.display = 'block';
}
});
function testPlay(){
test_video.play();
}
window.οnresize=function(){
//alert("haha");
test_video.style.width = screen.width;
test_video.style.height = screen.height;
}
function portrait(){
test_video.setAttribute("x5-video-orientation", "portrait");
}
function landscape(){
test_video.setAttribute("x5-video-orientation", "landscape");
}
function autoOrientation(){
test_video.setAttribute("x5-video-orientation", "landscape|portrait")
}
</script>
</body></html>
不写注释的都是仅作为个人笔记,不懂可以留言。