0

我想制作一个按钮,如果按下它就像按下键盘上的 F11 键一样。对于按钮 html 会是这样的(我认为)

<button type="button" onclick="some function">FullScreen</button>

现在我不知道那个 onclick 中会出现什么功能,因为我没有 JS。如果在按下按钮时文本“FULLSCREEN”更改为“NORMAL WINDOW”,另一件事会很好,这样用户就可以意识到他们必须再次按下同一个按钮才能退出全屏,就像每次单击时切换文本从“FULLSCREEN”变为“NORMAL WINDOW”,然后如果再次按下则变为“FULLSCREEN”。

4

2 回答 2

1

function ToggleFullScreen() {
  // UniversalXPConnect privilege is required in Firefox
  try {
    if (window.netscape && netscape.security) { // Firefox
      netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");
    }
  } catch (e) {
    alert("UniversalXPConnect privilege is required for this operation!");
    return;
  }

  if ('fullScreen' in window) {
    window.fullScreen = !window.fullScreen;
  } else {
    alert("Your browser does not support this example!");
  }
}
<body>
  Press this button,
  <button onclick="ToggleFullScreen ();">Change full screen mode!</button>
  or press F11 to toggle between normal and full screen mode.
</body>

于 2012-04-26T11:43:48.980 回答
-1

.jsp 页面

<img alt="" src="../static/images/Full_Screen.png" height="30" width="30" title="Full screen" id="fullscreen" name="fullscreen"/>
<img alt="" src="../static/images/Exit_full_screen.png" height="30" width="30" title=" Exit Full screen" id="exitFullscreen" name="exitFullscreen"/>

.js

var full=0;
$(function() {
    $('#exitFullscreen').hide();//hide exit fullscreen image on page load

    $('#exitFullscreen').click(function() {
        exitFullscreen();//function to exit from full screen

    });

    $('#fullscreen').click(function() {
        fullscreen();//function to get  full screen
    });
});

//if user click f11 instead button we have to toggle ....
    $(document).keyup(function(e){
       if(e.which==122){
           e.preventDefault();//kill anything that browser may have assigned to it by default
           if(full==1){
              exitFullscreen();
            }
          else {
              fullscreen();
          }
       }
});

function fullscreen() {

    var docElm = document.documentElement;

    if (docElm.requestFullscreen) {
        docElm.requestFullscreen();

    } else if (docElm.mozRequestFullScreen) {
        docElm.mozRequestFullScreen();
    } else if (docElm.webkitRequestFullScreen) {
        docElm.webkitRequestFullScreen();
    }

    $('#exitFullscreen').show();
    $('#fullscreen').hide();
    full=1;

}

function exitFullscreen() {
    if (document.cancelFullScreen) {
        document.cancelFullScreen();}
        else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
        }
        else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen();
        }
        else if (document.msExitFullscreen) {
        document.msExitFullscreen();
        } 
    $('#exitFullscreen').hide();
    $('#fullscreen').show();
    full=0;
}

//worked on moxz
于 2015-03-10T07:58:32.953 回答