MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Element.requestFullscreen()

Element.requestFullscreen() 方法用于发出异步请求使元素进入全屏模式。

调用此API并不能保证元素一定能够进入全屏模式。如果元素被允许进入全屏幕模式,document对象会收到一个fullscreenchange事件,通知调用者当前元素已经进入全屏模式。如果全屏请求不被许可,则会收到一个fullscreenerror事件。

只有包含在顶层文档(top-level document)内部的标准HTML元素、<svg>元素和<math>元素,以及拥有allowfullscreen属性的iframe的内部元素可以进入全屏模式。这意味着在frame内部的元素,以及object的内部元素不能进入全屏模式。

语法

Element.requestFullscreen();

示例

在调用requestFullScreen()之前,可以对fullscreenchange 和 fullscreenerror事件进行监听,这样在请求进入全屏模式成功或者失败时都能收到事件通知。

API规格

Specification Status Comment
Fullscreen API
Element.requestFullScreen()
Living Standard Initial definition

浏览器兼容性

Feature Chrome Edge Firefox Internet Explorer Edge Opera Safari
Basic support (Yes)webkit[1] (Yes) 9.0 (9.0) as mozRequestFullScreen[2]
47.0 (47.0) (behind full-screen-api.unprefix.enabled
11ms[3] (Yes)[3] ? ?
Feature Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support ? (Yes) 9.0 (9.0) as mozRequestFullScreen[2]
47.0 (47.0) (behind full-screen-api.unprefix.enabled
? ? ?

[1] 同样以webkitRequestFullScreen方法实现。

[2] 使用带有浏览器前缀的mozRequestFullScreen方法实现。在火狐44之前版本,Gecko浏览器内核错误地允许frame里面元素以及object元素进入全屏模式。而在之后的版本,这个漏洞被修复:仅允许位于顶部文档(top-level document)的元素,以及拥有allowfullscreen属性的iframe的内部元素进入全屏显示。. 

[3] 详见 documentation on MSDN.

参阅

文档标签和贡献者

 此页面的贡献者: cokepluscarbon
 最后编辑者: cokepluscarbon,