复制代码代码如下：
（関数 （） {
var fullscreenapi = {
supportsfullscreen：false、
isfullscreen：function（）{
falseを返します。
}、
requestfullscreen：function（）{}、
cancelfullscreen：function（）{}、
fullscreeneventname： ''、
プレフィックス： ''
}、
browserprefixes = 'webkit moz o ms khtml'.split（' '）;
//ネイティブサポートを確認してください
if（typeof document.cancelfullscreen！= 'undefined'）{
fullscreenapi.supportsfullscreen = true;
} それ以外 {
//ベンダープレフィックスによるフルスクリーンサポートを確認してください
for（var i = 0、il = browserprefixes.length; i <il; i ++）{
fullscreenapi.prefix = browserprefixes [i];
if（typeof document [fullscreenapi.prefix + 'cancelfullscreen']！= 'undefined'）{
fullscreenapi.supportsfullscreen = true;
壊す;
}
}
}
//便利なことをする方法を更新します
if（fullscreenapi.supportsfullscreen）{
fullscreenapi.fullscreeneventname = fullscreenapi.prefix + 'fullscreenchange';
fullscreenapi.isfullscreen = function（）{
switch（this.prefix）{
場合 ''：
document.fullscreenを返します。
ケース「WebKit」：
document.webkitisfullscreenを返します。
デフォルト：
return document [this.prefix + 'fullscreen'];
}
}
fullscreenapi.requestfullscreen = function（el）{
return（this.prefix === ''）？ el.requestfullscreen（）：el [this.prefix + 'requestfullscreen']（）;
}
fullscreenapi.cancelfullscreen = function（el）{
return（this.prefix === ''）？ document.cancelfullscreen（）：document [this.prefix + 'cancelfullscreen']（）;
}
}
// jQueryプラグイン
if（typeof jquery！= 'undefined'）{
jquery.fn.requestfullscreen = function（）{
return this.eact（function（）{
if（fullscreenapi.supportsfullscreen）{
fullscreenapi.requestfullscreen（this）;
}
}）;
};
}
// APIをエクスポートします
window.fullscreenapi = fullscreenapi;
}）（）;
$（function（）{
$（ "＃fullscreenbtn"）。クリック（function（）{
$（ "＃fullscreen"）。requestfullscreen（）;
}）;
if（window.top！= self）{
$（ "＃tip"）。text（ "iframe 里面不能演示该功能！请点击右下角的全屏查看！"）。show（）;
}
}）;
if（！fullscreenapi.supportsfullscreen）{
アラート（ "您的破浏览器不支持全屏api哦、请换高版本的chrome或者box"）;
}
复制代码代码如下：
<！doctype html>
<html>
<head>
<meta http-equiv = "content-type" content = "text/html; charset = utf-8">
<Title> JavaScript </title>
<Script Id = "jQuery_183" Type = "text/javascript" src = jquery-1.8.3.min.js "> </script>
</head>
<body>
<button id = "fullscreenbtn">点击我进入全屏模式</button>
<div id = "fullscreen">
<h1>
我是全屏区域的内容！
</h1>
<div id = "tip" style = "display：none;">
</div>
</div>
</body>
</html>
复制代码代码如下：
体{
背景：#fff;
}
ボタン{
ボーダー：1pxソリッド#ccc;
カーソル：ポインター;
表示：ブロック;
マージン：自動;
位置：相対;
トップ：100px;
}
。全画面表示{
パディングトップ：10％;
テキストアライグ：センター;
背景：繰り返しスクロール0 0 #ffffff;
}
/ * Mozilla Proposal（Dash） */
.fullscreen：フルスクリーン{
幅：100％;
高さ：100％;
}
/ * W3C提案（ダッシュなし） */
.fullscreen：フルスクリーン{
幅：100％;
高さ：100％;
}
/ *現在働いているベンダープレフィックス */
.fullscreen：-webkit-full-screen、.fullscreen：-moz-full-screen {
幅：100％;
高さ：100％;
}
：-webkit-full-screen {
幅：100％;
高さ：100％;
}