测试 浏览器 是否支持 full screen

<!DOCTYPE HTML PUBLIC ”-//W3C//DTD HTML 4.0 Transitional//EN”>

<html>

<head>

<title>Untitled</title>

</head>

<script>

function load(){

//alert(document.body.clientHeight);

window.addEventListener(“orientationchange”,change);

document.addEventListener(“fullscreenchange”,full);

FullScreenSupported();

console.log(document.webkitRequestFullScreen);

 

}

function FullScreenSupported() { 

if (document.webkitIsFullScreen) {

console.log(“webkitIsFullScreen is supported”);

}else{

console.log(“webkitIsFullScreen is not supported”);

}

var elem = document.getElementById(“myvideo”);

alert(“elem.requestFullScreen:”+elem.requestFullScreen);

alert(“elem.mozRequestFullScreen:”+elem.mozRequestFullScreen);

alert(“elem.webkitRequestFullScreen:”+elem.webkitRequestFullScreen);

if (elem.requestFullScreen){

elem.requestFullScreen();

} else if (elem.mozRequestFullScreen) {

elem.mozRequestFullScreen();

} else if (elem.webkitRequestFullScreen) {

elem.webkitRequestFullScreen();

}

}

function full(){

alert(‘full screen’);

}

function interval(){

alert(document.body.fullscreenEnabled);

setTimeout(function (){

alert(document.body.clientHeight);

},100);

}

function change(){

setInterval(“interval()”,1000);

}

</script>

<body onload=”load();”>

 

Hello World!

 <video id=”myvideo” width=”420″>

    <source src=”http://www.w3schools.com/html/mov_bbb.mp4″ type=”video/mp4″ />

    <source src=”http://www.w3schools.com/html/mov_bbb.ogg” type=”video/ogg” />

    Your browser does not support HTML5 video.

  </video>

</body>

</html>

 

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>