用JavaScript实现网页全屏效果切换

本人今天看到一个页面全屏化的功能,觉得很不错,以后可能用到,所以贴出来,让大家使用,转载的别人的代码,不喜勿喷,本人测试,非常好用,谢谢!

  1. function toggleFullScreen() {
  2. if (!document.fullscreenElement && // alternative standard method
  3. !document.mozFullScreenElement && !document.webkitFullscreenElement) {// current working methods
  4. if (document.documentElement.requestFullscreen) {
  5. document.documentElement.requestFullscreen();
  6. } else if (document.documentElement.mozRequestFullScreen) {
  7. document.documentElement.mozRequestFullScreen();
  8. } else if (document.documentElement.webkitRequestFullscreen) {
  9. document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
  10. }
  11. } else {
  12. if (document.cancelFullScreen) {
  13. document.cancelFullScreen();
  14. } else if (document.mozCancelFullScreen) {
  15. document.mozCancelFullScreen();
  16. } else if (document.webkitCancelFullScreen) {
  17. document.webkitCancelFullScreen();
  18. }
  19. }
  20. }

 

调用即可

<input value=“全屏” type=‘button’ onclick=‘toggleFullScreen();’ />

发表评论