The code is as follows:
= false;//Whether the following ie11 enters the full screen flag, true is full screen status, false is non-full screen status = false;// Whether ie11 enters the full screen flag, true is full screen status, false is non-full screen status //Cross-browser return to whether the current document has entered the state where full screen mode can be requested function fullscreenEnable(){
var isFullscreen = ||
||
||
;
return isFullscreen;
}
//full screen var fScreen = function(){
var docElm = ;
if () {
();
}
else if () {
();
ieIsfSceen = true;
}
else if () {
();
}
else if () {
();
}else {//For processing of browsers that do not support full-screen API, hide elements that do not need to be displayed ();
isflsgrn = true;
$("#fsbutton").text("Exit full screen"); }
}
//Exit full screen var cfScreen = function(){
if () {
();
}
else if () {
();
}
else if () {
();
}
else if () {
();
}else {
();
isflsgrn = false;
$("#fsbutton").text("full screen"); }
}
//Full screen button click event $("#fsbutton").click(function(){
var isfScreen = fullscreenEnable();
if(!isfScreen && isflsgrn == false){
if (ieIsfSceen == true) {
();
ieIsfSceen = false;
return;
}
fScreen();
}else{
cfScreen();
}
})
//Keyboard operation $(document).keydown(function (event) {
if( == 27 && ieIsfSceen == true){
ieIsfSceen = false;
}
});
//The listening status changes if () {
('fullscreenchange', function(){
if($("#fsbutton").text() == "Full Screen"){ $("#fsbutton").text("Exit full screen"); }else{
$("#fsbutton").text("full screen"); }
});
('webkitfullscreenchange', function(){
if($("#fsbutton").text() == "Full Screen"){ $("#fsbutton").text("Exit full screen"); }else{
$("#fsbutton").text("full screen"); }
});
('mozfullscreenchange', function(){
if($("#fsbutton").text() == "Full Screen"){ $("#fsbutton").text("Exit full screen"); }else{
$("#fsbutton").text("full screen"); }
});
('MSFullscreenChange', function(){
if($("#fsbutton").text() == "Full Screen"){ $("#fsbutton").text("Exit full screen"); }else{
$("#fsbutton").text("full screen"); }
});
}
It is worth noting that the fullscreenEnabled parameter has different opinions on the Internet. Some say it is to monitor whether the browser has entered a state where fullscreen can be requested, and some say it is just a sign to determine whether the browser supports fullscreen. There is indeed a problem during actual use. IE11 cannot recognize this attribute, and you need to set a separate mark to control whether IE11 is currently in fullscreen state.
The above is the entire content of this article. I hope the content of this article will be of some help to everyone’s study or work. If you have any questions, you can leave a message to communicate. Thank you for your support!