全屏幕全屏JS全屏API

复制代码代码如下所示：
（函数（）{（））
无功fullscreenapi = { {
supportsfullscreen：假，
IsFullScreen：函数（）{
返回false；
}，
RequestFullScreen：函数（）{ }，
cancelfullscreen：函数（）{ }，
fullscreeneventname：，
前缀：
}，
browserprefixes = 'webkit MOZ O MS KHTML，分裂（）；

对于本机支持检查
如果（typeof document.cancelfullscreen！= 'undefined）{
fullscreenapi.supportsfullscreen =真；
{人}
查看全屏支持供应商 / /前缀
对于（var i = 0，IL = browserprefixes.length；i < IL；i++）{
fullscreenapi.prefix = browserprefixes {我}；

如果（typeof文件{ fullscreenapi.prefix + 'cancelfullscreen}！= 'undefined）{
fullscreenapi.supportsfullscreen =真；

打破；
}
}
}

方法做一些有用的/更新
如果（fullscreenapi。supportsfullscreen）{
fullscreenapi.fullscreeneventname = fullscreenapi.prefix + 'fullscreenchange；

fullscreenapi.isfullscreen =函数（）{
开关（这个前缀）{
案例'：
返回document.fullscreen；
case'webkit：
返回document.webkitisfullscreen；
违约:
返回文件{ this.prefix + 'fullscreen}；
}
}
fullscreenapi.requestfullscreen =功能（EL）{
返回（this.prefix = EL。requestfullscreen）：萨尔瓦多{ this.prefix（）+（'requestfullscreen}）；
}
fullscreenapi.cancelfullscreen =功能（EL）{
返回（this.prefix =文件。cancelfullscreen）：文件{ this.prefix（）+（'cancelfullscreen}）；
}
}

jQuery插件
如果（typeof jQuery！= 'undefined）{
jquery.fn.requestfullscreen =函数（）{

返回this.each（函数（）{（）
如果（fullscreenapi。supportsfullscreen）{
FullScreenApi.requestFullScreen（本）；
}
}）；
}；
}

导出
window.fullscreenapi = fullscreenapi；
}）；

$（函数（）{（））
$（# fullscreenbtn）。Click（function（）{）
$（#全屏）RequestFullScreen（）；
}）；

如果（window.top！=自我）{
$(#tip).Text (iframe does not demonstrate this function!请点击右下角的全屏；
}
}）；

如果（！fullscreenapi。supportsfullscreen）{
警报（你的破浏览器不支持全屏API哦，请更换高版本的Chrome或燃烧室！；
}


复制代码代码如下所示：




启用Javaｓｃｒｉｐｔ的全屏




点击我进入全屏模式


我是全屏区。









复制代码代码如下所示：
体{
背景：# FFF；
}
按钮{
边境：1px solid # CCC；
光标：指针；
显示块；
保证金：汽车；
职位：相对；
上图：100px；
}

全屏{。
填充：10%；
文本对齐：中心；
背景：没有重复滚动00 # ffffff；
}

Mozilla建议（破折号）
{全屏：全屏。
宽度：100%；
身高：100%；
}

* W3C建议（无破折号）。
{全屏：全屏。
宽度：100%；
身高：100%；
}

当前正在工作的供应商前缀
全屏：全屏，WebKit，。全屏：全屏{ -moz
宽度：100%；
身高：100%；
}
：- WebKit全屏{
宽度：100%；
身高：100%；
}