測試環境：
【作業系統】： win7 64位
【ie】：ie9
【firefox】： firefox 29
【chrome】： chrome 34
衆所周知，ie是個奇葩的浏覽器，但是由于使用者量很大，開發者還是不得不為ie考慮一下，于是，各種浏覽器相關的操作，都要多一個特别的判斷——專門針對ie浏覽器的判斷，這裡的全屏也不例外。看代碼：
<a href="http://my.oschina.net/itblog/blog/228654#">?</a>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<code>function</code> <code>fullscreen() {</code>
<code> </code><code>var</code> <code>el = document.documentelement;</code>
<code> </code><code>var</code> <code>rfs = el.requestfullscreen || el.webkitrequestfullscreen || </code>
<code> </code><code>el.mozrequestfullscreen || el.msrequestfullscreen;</code>
<code> </code><code>if</code><code>(</code><code>typeof</code> <code>rfs != </code><code>"undefined"</code> <code>&& rfs) {</code>
<code> </code><code>rfs.call(el);</code>
<code> </code><code>} </code><code>else</code> <code>if</code><code>(</code><code>typeof</code> <code>window.activexobject != </code><code>"undefined"</code><code>) {</code>
<code> </code><code>//for ie，這裡其實就是模拟了按下鍵盤的f11，使浏覽器全屏</code>
<code> </code><code>var</code> <code>wscript = </code><code>new</code> <code>activexobject(</code><code>"wscript.shell"</code><code>);</code>
<code> </code><code>if</code><code>(wscript != </code><code>null</code><code>) {</code>
<code> </code><code>wscript.sendkeys(</code><code>"{f11}"</code><code>);</code>
<code> </code><code>}</code>
<code> </code><code>}</code>
<code>}</code>
<code>function</code> <code>exitfullscreen() {</code>
<code> </code><code>var</code> <code>el = document;</code>
<code> </code><code>var</code> <code>cfs = el.cancelfullscreen || el.webkitcancelfullscreen || </code>
<code> </code><code>el.mozcancelfullscreen || el.exitfullscreen;</code>
<code> </code><code>if</code><code>(</code><code>typeof</code> <code>cfs != </code><code>"undefined"</code> <code>&& cfs) {</code>
<code> </code><code>cfs.call(el);</code>
<code> </code><code>//for ie，這裡和fullscreen相同，模拟按下f11鍵退出全屏</code>
下面是個簡單的例子（假設上面的代碼儲存在script.js檔案中）：在兩個按鈕中調用這兩個函數即可實作：
<code><</code><code>html</code><code>></code>
<code><</code><code>head</code><code>></code>
<code><</code><code>script</code> <code>type</code><code>=</code><code>"text/javascript"</code> <code>src</code><code>=</code><code>"script.js"</code><code>></</code><code>script</code><code>></code>
<code></</code><code>head</code><code>></code>
<code><</code><code>body</code><code>></code>
<code><</code><code>div</code> <code>style</code><code>=</code><code>"margin-top:50px"</code><code>> </code><code><!-- 設定margin-top是為了檢視ie全屏前後的差別 --></code>
<code> </code><code><</code><code>input</code> <code>type</code><code>=</code><code>"button"</code> <code>value</code><code>=</code><code>"fullscreen"</code> <code>onclick</code><code>=</code><code>"fullscreen()"</code> <code>/></code>
<code> </code><code><</code><code>input</code> <code>type</code><code>=</code><code>"button"</code> <code>value</code><code>=</code><code>"exitfullscreen"</code> <code>onclick</code><code>=</code><code>"exitfullscreen()"</code> <code>/></code>
<code></</code><code>div</code><code>></code>
<code></</code><code>body</code><code>></code>
<code></</code><code>html</code><code>></code>
話不多說，先看火狐：全屏前
全屏後（會出現相應的提示資訊）：
再看看谷歌：全屏前：
全屏後（也有相應的提示）：
最後看看奇葩的ie：全屏前：
點選【fullscreen】後，浏覽器下方會出現下面的提示：
點選【允許阻止的内容】，再點選【fullscreen】會出現下面的警告：
點選【是】，此時浏覽器會全屏，如下圖：
上圖中，ie已經全屏，還顯示位址欄，是因為我把光标放在了螢幕的頂端，導緻位址欄下滑，于是按鈕上方50px的間隔也被遮住了。這也是為什麼在代碼中設定margin-top:50px的原因。把光标移開，浏覽器位址欄自動上滑消失。如下圖：
到此，幾種主流的浏覽器全屏已經測試完畢。