window.isflsgrn=false;//IE11以下是否进入全屏标志,True为全屏状态,false为非全屏状态
window.ieIsfSceen=false;//IE11是否进入全屏标志,true为全屏状态,false为非全屏状态
//跨浏览器返回当前 document是否进入了可以请求全屏模式的状态
function fullscreenEnable(){
var isFullscreen=document.fullscreenEnabled||window.fullScreen||
document.mozFullscreenEnabled||document.webkitIsFullScreen;
return isFullscreen;
}
//全屏
var fScreen=function(){
var docElm=document.documentElement;
if(docElm.requestFullscreen){
docElm.requestFullscreen();
}
else if(docElm.msRequestFullscreen){
docElm.msRequestFullscreen();
ieIsfScreen=true;
}
else if(docElm.mozRequestFullScreen){
docELm.mozRequestFullScreen();
}
else if(docElm.webkitRequestFullScreen){
docElm.webkitRequestFullScreen();
}else{//对不支持全屏API浏览器的处理,隐藏不需要显示的元素
window.parent.hideTopBottom();
isflsgrn=true;
$("#fsbutton").text("退出全屏");
}
}
//退出全屏
var cfScreen=function(){
if(document.exitFullscreen){
document.exitFullscreen();
}
else if(document.msExitFullscreen){
document.msExitFullscreen();
}
else if(document.mozCancelFullScreen){
document.mozCancelFullScreen();
}
else if(document.webkitCancelFullScreen){
document.webkitCancelFullScreen();
}
else{
window.parent.showTopBottom();
isflsgrn=false;
$("#fsbutton").text("全屏");
}
}
//全屏按钮点击事件
$("#fsbutton").click(function(){
var isfScreen=fullscreenEnable();
if(!isfScreen && isflsgrn==false){
if(ieIsfSceen==true){
document.msExitFullscreen();
ieIsfSceen=false;
return ;
}
fScreen();
}
else{
cfScreen();
}
})
//键盘操作
$(document).keydown(function (event){
if(event.keyCode==27&&ieIsfSceen==true){
ieIsfSceen=false;
}
});
//监听状态变化
if(window.addEventListener){
document.addEventListener('fullscreenchange',function(){
if($("#fsbutton").text()=="全屏"){
$("#fsbutton").text()=="退出全屏");
}else{
$("#fsbutton").text("全屏");
}
});
document.addEventListener('webkitfullscreenchange',function(){
if($("#fsbutton").text()=="全屏"){
$("fsbutton").text("退出全屏");
}
else{
$("#fsbutton").text("全屏");
}
});
document.addEventListener('mozfullscreenchange',function(){
if($("#fsbutton").text()=="全屏"){
$("#fsbutton").text("退出全屏");
}
else{
$("#fsbutton").text("全屏");
}
});
document.addEventListener('MSFullscreenChange',function(){
if($("#fsbutton").text()=="全屏"){
$("#fsbutton").text("退出全屏");
}else{
$("#fsbutton").text("全屏");
}
});
}