設置全屏和退出全屏

//全屏設置 $('#fullScreen').on('click', function () {  fullScreen(); }); //退出全屏 $('#exitFullScreen').on('click', function () {  exitFullScreen(); }); //進入全屏function fullScreen() { var obj = document.getElementById('editMark'); if (obj.requestFullScreen) {  obj.requestFullScreen(); } else if (obj.webkitRequestFullScreen) {  obj.webkitRequestFullScreen(); } else if (obj.msRequestFullScreen) {  obj.msRequestFullScreen(); } else if (obj.mozRequestFullScreen) {  obj.mozRequestFullScreen(); }}function exitFullScreen() { var obj = document.getElementById('editMark'); if (document.exitFullscree) {  document.exitFullscree(); } else if (document.webkitExitFullscreen) {  document.webkitExitFullscreen(); } else if (document.msExitFullscreen) {  document.msExitFullscreen(); } else if (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);

以上這篇元素全屏的設置與監聽實例就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持錯新站長站。