元素全屏的設定與監聽執行個體，全屏監聽執行個體

元素全屏的設定與監聽執行個體，全屏監聽執行個體

設定全屏和退出全屏

//全屏設定 $('#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);

以上這篇元素全屏的設定與監聽執行個體就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支援幫客之家。