aa.html 3.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <html>
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  4. <script type="text/javascript" src="/lib/jquery-3.4.1.js"></script>
  5. <script type="text/javascript" src="/lib/jquery-3.4.1.min.js"></script>
  6. <script src="/lib/jquery.min.js"></script>
  7. <script>
  8. function quan() {
  9. /*全屏iframe兼容*/
  10. var docElm = document.documentElement;
  11. if (docElm.requestFullscreen) {
  12. docElm.requestFullscreen();
  13. } else if (docElm.mozRequestFullScreen) {
  14. docElm.mozRequestFullScreen();
  15. } else if (docElm.msRequestFullscreen) {
  16. docElm.msRequestFullscreen();
  17. } else if (docElm.oRequestFullscreen) {
  18. docElm.oRequestFullscreen();
  19. } else if (docElm.webkitRequestFullScreen) {
  20. docElm.webkitRequestFullScreen();
  21. }
  22. $(".grid_12").css("display", "none");
  23. $("#site_info").css("display", "none");
  24. $("#full-screen-btn").css("display", "none");
  25. $("iframe").css("height", "100%");
  26. $("iframe").css("width", "100%");
  27. $("iframe").css("position", 'fixed');
  28. $("iframe").css("left", "0px");
  29. $("iframe").css("top", "0px");
  30. }
  31. function exitQ() {
  32. var mainheight = $('.sidemenu').height();
  33. $(".grid_12").css("display", "");
  34. $("#site_info").css("display", "");
  35. $("#full-screen-btn").css("display", "");
  36. /*退屏iframe兼容*/
  37. if (document.exitFullscreen) {
  38. document.exitFullscreen();
  39. } else if (document.msExitFullscreen) {
  40. document.msExitFullscreen();
  41. } else if (document.mozCancelFullScreen) {
  42. document.mozCancelFullScreen();
  43. } else if (document.oRequestFullscreen) {
  44. document.oCancelFullScreen();
  45. } else if (document.webkitCancelFullScreen) {
  46. document.webkitCancelFullScreen();
  47. }
  48. $("iframe").css("height",mainheight + 'px');
  49.        $("iframe").css("width", "");
  50.        $("iframe").css("position", "");
  51.         $("iframe").css("left", "");
  52.         $("iframe").css("top", "");
  53. }
  54. $("#full-screen-btn").click(function () {
  55. if ($("#full-screen-btn").text() == "全屏显示") {
  56. parent.quan();
  57. $("#full-screen-btn").text("退出全屏");
  58. } else {
  59. parent.exitQ();
  60. $("#full-screen-btn").text("全屏显示");
  61. }
  62. });
  63. </script>
  64. <style>
  65. body, html {
  66. height: 100%;
  67. margin: 0;
  68. }
  69. .fullScreen {
  70. width: 100%;
  71. height: 100%;
  72. position: absolute;
  73. top: 0;
  74. left: 0;
  75. }
  76. </style>
  77. </head>
  78. <body>
  79. <iframe id="iframe_view" class="embed-responsive-item container well well-small span6" style="height: 720px; width: 1280px; background-color: #2e2e2e;" src="https://www.baidu.com/" frameborder="0" scrolling="no" allowfullscreen>
  80. </iframe>
  81. </body>
  82. </html>