全屏

作者: 撑船的摆渡人 | 来源:发表于2021-09-05 13:50 被阅读0次
// 判读当前是否是全屏
function isFullscreen() {
  return document.fullscreenElement && document.fullscreenElement !== null;
}
// 设置全屏
function requestFullscreen(element) {
  if (element.requestFullscreen) {
    element.requestFullscreen();
  } else if (element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if (element.msRequestFullscreen) {
    element.msRequestFullscreen();
  } else if (element.webkitRequestFullscreen) {
    element.webkitRequestFullScreen();
  }
}
//esc 取消全屏
function exitFullscreen() {
  if (document.exitFullscreen) {
    document.exitFullscreen();
  } else if (document.msExitFullscreen) {
    document.msExitFullscreen();
  } else if (document.mozCancelFullScreen) {
    document.mozCancelFullScreen();
  } else if (document.webkitExitFullscreen) {
    document.webkitExitFullscreen();
  }
}
// 点击设置全屏
var imgDiv = document.getElementById("imgsrc");
imgDiv.onclick = function () {
  if (isFullscreen()) {
    exitFullscreen();
  } else {
    requestFullscreen(imgDiv);
  }
};

相关文章

网友评论

      本文标题:全屏

      本文链接:https://www.haomeiwen.com/subject/maejwltx.html