属性1：fullscreenElement 该属性返回当前处于全屏模式的DOM元素。
属性2：fullscreenEnabled 该属性返回当前 document 是否进入了可以请求全屏模式的状态。
方法1：requestFullscreen() 请求进入全屏模式。
方法2：exitFullscreen() 退出全屏模式。
事件1：fullscreenchange 进入/退出全屏模式切换时会触发。
事件2：fullscreenerror 进入/退出全屏模式失败时会触发。
由于fullscreen API 存在浏览器兼容性问题，所以我们在使用的时候需要进行跨浏览器处理，参考代码：
跨浏览器返回正处于全屏的元素
function fullscreenElement(){
var fullscreenEle = document.fullscreenElement ||
document.mozFullScreenElement ||
document.webkitFullscreenElement
//注意：要在用户授权全屏后才能获取全屏的元素，否则 fullscreenEle为null
console.log("全屏元素："+fullscreenEle)
return fullscreenEle
}
跨浏览器返回当前 document 是否进入了可以请求全屏模式的状态
function fullscreenEnable(){
var isFullscreen = document.fullscreenEnabled ||
window.fullScreen ||
document.webkitIsFullScreen ||
document.msFullscreenEnabled
//注意：要在用户授权全屏后才能准确获取当前的状态
if(isFullscreen){
console.log('全屏模式')
}else{
console.log('非全屏模式')
}
}
跨浏览器发动全屏
function lanchFullscreen(element){
if(element.requestFullscreen){
element.requestFullscreen()
}
else if(element.mozRequestFullScreen){
element.mozRequestFullScreen()
}
else if(element.msRequestFullscreen){
element.msRequestFullscreen()
}
else if(element.webkitRequestFullscreen){
element.webkitRequestFullScreen()
}
}
跨浏览器退出全屏
function exitFullscreen(){
if(document.exitFullscreen){
document.exitFullscreen()
}
else if(document.mozCancelFullScreen){
document.mozCancelFullScreen()
}
else if(document.msExitFullscreen){
document.msExiFullscreen()
}
else if(document.webkitCancelFullScreen){
document.webkitCancelFullScreen()
}
}
各浏览器fullscreenchange 事件处理
document.addEventListener('fullscreenchange', function(){ /*code*/ })
document.addEventListener('webkitfullscreenchange', function(){ /*code*/})
document.addEventListener('mozfullscreenchange', function(){ /*code*/})
document.addEventListener('MSFullscreenChange', function(){ /*code*/})
各浏览器fullscreenerror 事件处理
document.addEventListener('fullscreenerror', function(){ /*code*/ })
document.addEventListener('webkitfullscreenerror', function(){ /*code*/})
document.addEventListener('mozfullscreenerror', function(){ /*code*/)
document.addEventListener('MSFullscreenError', function(){ /*code*/ })
跨浏览器全屏模式下样式代码
:-webkit-full-screen { }
:-moz-full-screen { }
:-ms-fullscreen { }
:fullscreen { }
<!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 http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function openWin(){
var targeturl="http://www.baidu.com"
newwin=window.open("","newWindow","resize=no")
if (document.all){
newwin.moveTo(0,0)
newwin.resizeTo(screen.width,screen.height)
}
newwin.location=targeturl
}
</script>
</head>
<body>
<a href="###" onclick="openWin()">dddddddddd</a>
</body>
</html>
说明：open方法的第三个参数即是设置新窗口各参数的，设置其中几项其余没设置的默认为否，open方法的很多参数在现代浏览器已经失效，ff禁止打开一个没有状态条，输入框，大小小于一定程度并被移出用户视口的新窗口，ie7的用户设置如果是链接在标签页打开的话永远会在标签页打开
