各种浏览器全屏模式的方法、属性和事件介绍

HTML 5中的full screen,目前可以在除IE和opera外的浏览器中使用 ,有的时候用来做全屏API,游戏呀,等都很有用。先看常见的API

element.requestFullScreen()

作用:请求某个元素element全屏

浏览器全屏模式的启动函数requestFullscreen仍然需要附带各浏览器的js方言前缀,相信下面这段代码需要你花大量的搜索才能凑齐:

启动全屏:

各种浏览器全屏模式的方法、属性和事件介绍

对你想要全屏显示的页面元素调用全屏方法,浏览器窗口就会变成全屏,但会先请求用户允许全屏模式。要注意,用户很有可能会拒绝全屏模式。如果用户运行全屏模式,则浏览器的工具条等按钮菜单都会隐藏,你的页面会覆盖整个屏幕。


退出全屏:

各种浏览器全屏模式的方法、属性和事件介绍

这个exitFullscreen方法(也需要加浏览器前缀)会让浏览器退出全屏模式,变成正常模式。

需要注意的是,exitFullscreen只能由document对象调用,而不是启动全屏时传入的对象。


全屏样式CSS:

各种浏览器都提供了一个非常有用的全屏模式时的css样式规则:


各种浏览器全屏模式的方法、属性和事件介绍