使用javascript实现浏览器全屏

HTML 5中的full screen，目前可以在除IE和Opera外的浏览器中使用 ，有的时候用来做全屏API，游戏呀，等都很有用。先看常见的API1 element.requestFullScreen() 作用：请求某个元素element全屏2Document.getElementById(“myCanvas”).requestFullScreen() 这里是将其中的元素ID去请求fullscreen3退出全屏 document.cancelFullScreen()4Document.fullScreen 如果用户在全屏模式下，则返回true5 document.fullScreenElement 返回当前处于全屏模式下的元素 下面的代码是开启全屏模式：

1. functionfullScreen(element){
2. if(element.requestFullScreen){
3. element.requestFullScreen();
4. }elseif(element.webkitRequestFullScreen){
5. element.webkitRequestFullScreen();
6. }elseif(element.mozRequestFullScreen){
7. element.mozRequestFullScreen();
8. }
9. }

下面的代码就是整个页面调用全屏模式 var html = document.documentElement;fullScreen(html); 下面的则是对指定元素，比如 var canvas = document.getElementById('mycanvas');fullScreen(canvas); 如果要取消，同样：

1. //thehelperfunction
2. functionfullScreenCancel(){
3. if(document.requestFullScreen){
4. document.requestFullScreen();
5. }elseif(document.webkitRequestFullScreen){
6. document.webkitRequestFullScreen();
7. }elseif(document.mozRequestFullScreen){
8. document.mozRequestFullScreen();
9. }
10. }
13. fullScreenCancel();

不过老实说，FULL SCREEN有个问题，容易造成欺骗，比如在http://feross.org/html5-fullscreen-api-attack/中，其中就有一个很好的DEMO，去欺骗了，比如某个链结写的是http://www.bankofamerica.com,大家以为是美国银行，一点进去，因为使用了全屏幕API，就会欺骗到人

1. $('html').on('clickkeyPRess','a',function(event){
3. //不响应真正的AHREF点击事件
4. event.preventDefault();
5. event.stopPropagation();
7. //Triggerfullscreen
8. if(elementPrototype.requestFullscreen){
9. document.documentElement.requestFullscreen();
10. }elseif(elementPrototype.webkitRequestFullScreen){
11. document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
12. }elseif(elementPrototype.mozRequestFullScreen){
13. document.documentElement.mozRequestFullScreen();
14. }else{
15. //
16. }
18. //显示假的UI
19. $('#menu,#browser').show();
22. $('#target-site').show();
23. });

详细代码在https://github.com/feross/fullscreen-api-attack可以下载老外也提到了： Browser vendors are well aware of the potential security issues with fullscreen. For example, a malicious site could show a full screen Windows or Mac login window and steal a passWord. That’s why they are disabling keyboard support by default and only enabling by explicitly asking. — John Dyer