FullScreen JavaScript API 具体使用

　　FullScreen Javascript API 目前仍是草案，实现这个 API，更确切来说是具有这项功能的浏览器有：Chrome 15 / Firefox Nightly / Safari 5.1。对于 JS API 的前端调用，我们可以先看看下面的代码：

　　// Webkit (works in Safari5.1 and Chrome 15)

　　element.webkitRequestFullScreen();

　　document.webkitCancelFullScreen();

　　// Firefox (works in nightly)

　　element.mozRequestFullScreen();

　　document.mozCancelFullScreen();

　　// W3C 提议

　　element.requestFullscreen();

　　document.exitFullscreen();

　　只有两个方法，在需要调用全屏的元素调用 requestFullscreen() 方法，在需要退出时对 document 调用 exitFullscreen() 这个 API。问题不大，只是命名上的不同。

　　只是，厂商前缀，各浏览器的实现和 W3C 不一致，代码又得写得跟屎一样。我特意把不同用颜色标注出来。绿色的是相同的点，红色的是不同的点。在这一点上倒觉得 W3C 有点奇怪。好不容易 Webkit 和 Mozilla 是一致的，何必改掉命名。既然发，为什么不把 request 发成 enter 与 exit 对应?!。无论如何，至少可以实现，目前 IE 仍没有决定要不要实现这个草案，Johndyer 这样说：“I have an email from a IE team member saying they are discussing it, but have not made any decisions. ” 。呃~

　　在这里吐槽也没什么用，我们返回正题。浏览器支持 fullscreenchange 事件。让你可以为全屏做更多事。官方草案没有多提，只是略过，这一段来自 Johndyer 的代码，使用的是 Mozilla 的提案，具体使用还需要具体对待：

　　// Webkit-base: element.onwebkitfullscreenchange

　　// Firefox: element.onmozfullscreenchange

　　// W3C Method:

　　element.addEventListener('fullscreenchange', function(e) {

　　if (document.fullScreen) {

　　/* make it look good for fullscreen */

　　} else {

　　/* return to the normal state in page */

　　}

　　}, true);