進入全屏的一個demo
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>全屏</title>
<script type="text/javascript">
(function (a, b) {
"use strict";
var c = function () {
var a = [["requestFullscreen", "exitFullscreen", "fullscreenchange", "fullscreen", "fullscreenElement"], ["webkitRequestFullScreen", "webkitCancelFullScreen", "webkitfullscreenchange", "webkitIsFullScreen", "webkitCurrentFullScreenElement"], ["mozRequestFullScreen", "mozCancelFullScreen", "mozfullscreenchange", "mozFullScreen", "mozFullScreenElement"]];
for (var c = 0,
d = a.length; c < d; c++) {
var e = a[c];
if (e[1] in b) return e
}
} ();
if (!c) return a.screenfull = !1;
var d = "ALLOW_KEYBOARD_INPUT" in Element,
e = {
init: function () {
return b.addEventListener(c[2],
function (a) {
e.isFullscreen = b[c[3]],
e.element = b[c[4]],
e.onchange(a)
}),
this
},
isFullscreen: b[c[3]],
element: b[c[4]],
request: function (a) {
a = a || b.documentElement,
a[c[0]](d && Element.ALLOW_KEYBOARD_INPUT),
b.isFullscreen || a[c[0]]();
//alert("dd");
},
exit: function () {
b[c[1]]()
},
toggle: function (a) {
this.isFullscreen ? this.exit() : this.request(a)
},
onchange: function () { }
};
a.screenfull = e.init()
})(window, document)
</script>
</head>
<body>
<div id="loading" style="margin: 10px auto; width: 600px">
正在加載...</div>
<div id="theEnd">
</div>
<script type="text/javascript">
function ck() {
screenfull && screenfull.request();
};
//在這裏寫你的代碼...
var loading = document.getElementById('loading');
loading.style.cursor = 'pointer';
loading.innerHTML = '點擊開始';
loading.onclick = ck
</script>
</body>
</html>
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章