元素全屏的设置与监听实例
设置全屏和退出全屏
//全屏设置
$('#fullScreen').on('click',function(){
fullScreen();
});
//退出全屏
$('#exitFullScreen').on('click',function(){
exitFullScreen();
});
//进入全屏
functionfullScreen(){
varobj=document.getElementById('editMark');
if(obj.requestFullScreen){
obj.requestFullScreen();
}elseif(obj.webkitRequestFullScreen){
obj.webkitRequestFullScreen();
}elseif(obj.msRequestFullScreen){
obj.msRequestFullScreen();
}elseif(obj.mozRequestFullScreen){
obj.mozRequestFullScreen();
}
}
functionexitFullScreen(){
varobj=document.getElementById('editMark');
if(document.exitFullscree){
document.exitFullscree();
}elseif(document.webkitExitFullscreen){
document.webkitExitFullscreen();
}elseif(document.msExitFullscreen){
document.msExitFullscreen();
}elseif(document.mozCancelFullScreen){
document.mozCancelFullScreen();
}
}
监听全屏事件
//监听全屏
document.addEventListener('fullscreenchange',function(){
if(document.fullscreenElement){
alert(1);
}else{
alert(2);
}
},false);
document.addEventListener('msfullscreenchange',function(){
if(document.msFullscreenElement){
alert(1);
}else{
alert(2);
}
},false);
document.addEventListener('mozfullscreenchange',function(){
if(document.mozFullScreen){
alert(1);
}else{
alert(2);
}
},false);
document.addEventListener('webkitfullscreenchange',function(){
if(document.webkitIsFullScreen){
alert(1);
}else{
alert(2);
}
},false);
以上这篇元素全屏的设置与监听实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。