zoukankan      html  css  js  c++  java

  • 打开网页全屏显示

     

    打开网页全屏显示
    2010-06-09 11:19
    1. （1）打开全屏窗口   
    2. 方法如下：   
    3. 一：将下面的代码放在<HEAD>与</HEAD>之间   
    4. <script language="JavaScript">   
    5. <!--   
    6. function call(htmlurl) {   
    7. var   
    8. newwin=window.open(htmlurl,"airWin","top=0,left=0,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=796,height=546");//修改宽度和高度可控制窗口的大小   
    9. newwin.focus();   
    10. return false;}//--></script>   
    11.   
    12. 二：将下面的代码复制到〈BODY〉区并修改其中的链接地址和名称。   
    13. <a href=http://hi.baidu.com/horsewhite onclick='return call(this.href);'>全屏显示</a>   
    14.   
    15. （2）实现真正的全屏   
    16. 这种方法需按Alt+F4才能关闭。   
    17. 代码如下：   
    18. <html>   
    19. <head>   
    20. <meta http-equiv="Content-Type" content="text/html; charset=gb2312">   
    21. <title>全屏显示</title>   
    22. </head>   
    23. <body background=#00ccff>   
    24. <table border="1" width="100%">   
    25. <tr>   
    26. <td>   
    27. <p align="center">   
    28. <input type="BUTTON" name="FullScreen" value="全屏显示" onClick="window.open(document.location, 'www_helpor_net', 'fullscreen')">   
    29. </td>   
    30. </tr>   
    31. </table>   
    32. </body>   
    33. </html>   
    34.   
    35. （3）效果同上   
    36. 将下面的代码贴到body之间，即可实现同上的效果，关闭的方法也同上。   
    37. <INPUT onclick="window.open(document.location, 'www_helpor_net', 'fullscreen')" type=button value=全屏显示 name=FullScreen>   
    38. <SCRIPT language=JavaScript>   
    39. <!--   
    40. window.open("full_window.htm","新窗口","fullscreen=1");   
    41. window.opener=null;   
    42. window.close();   
    43. //-->   
    44. </SCRIPT>   
    45.   
    46. 详解下列收集的代码：   
    47. （4）瞒天过海法-javascript   
    48.   
    49. 我们知道，显示器的分辩率大小决定了我们看到的程序窗口的面积大小，分辩率越大，窗口面积越大，看到的内容就越多。但并不是说显示面积越大就越好，因为分辩率的变化会带来菜单文字的变化，可能会影响软件界面的字体美观。此乃题外话，就不细说了。浏览器同样是一种程序，其窗口的大小，我们可以利用脚本语言来控制调整，这样我们就可以实施瞒天过海法来达到全屏目的，方法是在网页文件的头部，也就是 < head > 与 < /head > 标签之间加上下面这段 javascript 代码：   
    50. < script >   
    51. < !--   
    52. function omiga_window(){   
    53. window.open("12.htm","","fullscreen=1,menubar=0,toolbar=0,directories=0,location=0,   
    54. status=0,scrollbars=0")   
    55. }   
    56. //-- >   
    57. < /script >   
    58. 代码功能是由一个网页调出另一个浏览器窗口，加上设置语句，设置新窗口的大小为全屏，然后新的网页内容就显示在此窗口里，借此实现了全屏。   
    59. 不要忘记在网页文件的 < body > 标签里加上加载网页里调用函数的代码。代码设置如下：   
    60. <body onload="omiga_window()" onBlur="self.close()" scroll="no">   
    61.   
    62. （5）借尸还魂法   
    63.   
    64. 可能有些朋友见到代码就害怕。告诉你，不怕！不懂脚本代码的我们可以使用 Dreamweaver 的插件，借尸还魂！实现全屏！   
    65. 首先我们到点击下载 “MFX-fullscreen.mxp”插件 到自己的硬盘里，接着打开 Dreamweaver4 菜单栏“Commands”，选择“Manage Extensions”命令，打开插件管理工具“Macromedia Extension Manager”，按“Ctrl + i”快捷键把插件安装好。   
    66. 接下来的事情就相当轻松了，重新启动一次 Dreamweaver4 ，按“Shift + F3”打开行为面板，再按快捷键“Ctrl + Tab”进入源代码窗口，点击行为面板的加号按钮，在弹出的菜单中选择“MFX”里的“MFX-fullscreen”命令马上可以看到 < head > 和 < /head > 是加入了全屏的代码，同时 < body > 里也加入了“onLoad”加载函数。按 F12 就可以看到全屏的效果。注意，没有进入源代码窗口该命令呈灰色，是不可选的。   
    67. 没有插件的朋友可以复制以下代码到网页文件：   
    68. <script language="JavaScript">   
    69. <!--   
    70. function MachakFull(Ie,other){   
    71. //Copyright ?1999 m.milicevic machakjoe@netscape.net jjooee@tip.nl   
    72. x=screen.availWidth;   
    73. y=screen.availHeight;   
    74. target = parseFloat(navigator.appVersion.substring(navigator.appVersion.indexOf('.')-1,navigator.appVersion.length));   
    75. if((navigator.appVersion.indexOf("Mac")!=-1) &&(navigator.userAgent.indexOf("MSIE")!=-1) &&(parseInt(navigator.appVersion)==4))   
    76. window.open(other,"sub",'scrollbars=yes');   
    77. if (target >= 4){   
    78. if (navigator.appName=="Netscape"){   
    79. var MachakFull=window.open(other,"MachakFull",'scrollbars=yes','width='+x+',height='+y+',top=0,left=0');   
    80. MachakFull.moveTo(0,0);   
    81. MachakFull.resizeTo(x,y);}   
    82. if (navigator.appName=="Microsoft Internet Explorer")   
    83. window.open(Ie,"MachakFull","fullscreen=yes");   
    84. }   
    85. else window.open(other,"sub",'scrollbars=yes');   
    86. }   
    87. //-->   
    88. </script>   
    89. </head>   
    90. 当然，<body> 里也加入了“onLoad”加载函数，代码如下：   
    91. <body bgcolor="#FFFFFF" text="#000000" onLoad="MachakFull('full_window.htm','')" >   
    92. 看了前面的两种方法，分析源代码，我们注意到，都必须先打开一个原来的窗口，我们称之为A，然后再调出一个新的浏览器窗口，我们称之为B。当 B 窗口打开时，就实现全屏了，并且位于最前面。但前面的两种方法都没有把原来的窗口 A 窗口关闭。我们可以在 < body > 里加入关闭的代码“onBlur="self.close"”或者“onBlur="javascript:window.closer()"”。可是，此两种关闭都会弹出一个关闭的提示框。无疑它影响了整个网页的显示效果！有办法解决么？当然有！请看下面的返璞归真法   
    93.   
    94. （6）返璞归真法   
    95.   
    96. 此法是最完美的一种全屏方式，实现代码与相应简单，一个完整的全屏网页代码如下：   
    97. <html>   
    98. <head >   
    99. <title>123</title>   
    100. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" >   
    101. <script >   
    102. <!--   
    103. function omiga_window(){   
    104. window.open("full_window.htm","","fullscreen,scrollbars")   
    105. }   
    106. //-->   
    107. </script>   
    108. </head>   
    109. <body onload="omiga_window()" onblur="focus();closes.Click();" scroll="no">   
    110. <object id=closes type="application/x-oleobject" classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">   
    111. <param name="Command" value="Close" >   
    112. </object>   
    113.   
    114. 全屏！   
    115. </body>   
    116. </html>   
    117. 实现全屏的代码跟之前的两种方法相类似，差别就在于可以自动关闭原来的A窗口，并且不出现提示。不出现提示的奥妙在于 < body > 标签里的：   
    118. onblur="focus();closes.Click();"  
    119. 以及< body >和< /body >之间的：   
    120. <object id=closes type="application/x-oleobject" classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">   
    121. <param name="Command" value="Close">   
    122. </object>   
    123. 要实现返璞归真完美全屏方式，不要漏了上面两段代码哟！

     
  • 相关阅读:
    VS2008 环境中完美搭建 Qt 4.7.4 静态编译的调试与发布 Inchroy's Blog 博客频道 CSDN.NET
    编写可丢弃的代码
    c++ using namespace std; 海明威 博客园
    解决MySQL server has gone away
    nginx upstream 调度策略
    (2006, 'MySQL server has gone away') 错误解决 dba007的空间 51CTO技术博客
    Linux IO模型漫谈（2） 轩脉刃 博客园
    redis源码笔记 initServer 刘浩de技术博客 博客园
    MySQLdb批量插入数据
    词库的扩充百度百科的抓取你知道这些热词吗？ rabbit9898 ITeye技术网站
  • 原文地址：https://www.cnblogs.com/Tonyyang/p/2131086.html
Copyright © 2011-2022 走看看