js控制頁(yè)面的全屏展示和退出全屏顯示的方法
更新時(shí)間：2015年03月10日 09:42:35 作者：JESTER_WILL
這篇文章主要介紹了js控制頁(yè)面的全屏展示和退出全屏顯示的方法,實(shí)例分析了javascript控制頁(yè)面全屏效果的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
本文實(shí)例講述了js控制頁(yè)面的全屏展示和退出全屏顯示的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<div style="margin:0 auto;height:600px;width:700px;">
<button id="btn">js控制頁(yè)面的全屏展示和退出全屏顯示</button>
<div id="content" style="margin:0 auto;height:500px;width:700px; background:#ccc;" >
<h1>js控制頁(yè)面的全屏展示和退出全屏顯示</h1>
</div>
</div>
</body>
<script language="JavaScript">
document.getElementById("btn").onclick=function(){
var elem = document.getElementById("content");
requestFullScreen(elem);
};
function requestFullScreen(element) {
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
if (requestMethod) {
requestMethod.call(element);
} else if (typeof window.ActiveXObject !== "undefined") {
var wscript = new ActiveXObject("WScript.Shell");
if (wscript !== null) {
wscript.SendKeys("{F11}");
}
}
}
</script>
</html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<body>
<div style="margin:0 auto;height:600px;width:700px;">
<button id="btn">js控制頁(yè)面的全屏展示和退出全屏顯示</button>
<div id="content" style="margin:0 auto;height:500px;width:700px; background:#ccc;" >
<h1>js控制頁(yè)面的全屏展示和退出全屏顯示</h1>
</div>
</div>
</body>
<script language="JavaScript">
document.getElementById("btn").onclick=function(){
var elem = document.getElementById("content");
requestFullScreen(elem);
};
function requestFullScreen(element) {
var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
if (requestMethod) {
requestMethod.call(element);
} else if (typeof window.ActiveXObject !== "undefined") {
var wscript = new ActiveXObject("WScript.Shell");
if (wscript !== null) {
wscript.SendKeys("{F11}");
}
}
}
</script>
</html>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
您可能感興趣的文章:
- js實(shí)現(xiàn)簡(jiǎn)單頁(yè)面全屏
- js模擬F11頁(yè)面全屏顯示
- javascript full screen 全屏顯示頁(yè)面元素的方法
- JS實(shí)現(xiàn)判斷滾動(dòng)條滾到頁(yè)面底部并執(zhí)行事件的方法
- js，jquery滾動(dòng)/跳轉(zhuǎn)頁(yè)面到指定位置的實(shí)現(xiàn)思路
- js監(jiān)聽(tīng)html頁(yè)面的上下滾動(dòng)事件方法
- 當(dāng)滾動(dòng)條滾動(dòng)到頁(yè)面底部自動(dòng)加載增加內(nèi)容的js代碼
- js判斷滾動(dòng)條是否已到頁(yè)面最底部或頂部實(shí)例
- js實(shí)現(xiàn)滾動(dòng)條滾動(dòng)到頁(yè)面底部繼續(xù)加載
- javascript實(shí)現(xiàn)全屏頁(yè)面滾動(dòng)效果
相關(guān)文章
Bootstrap富文本組件wysiwyg數(shù)據(jù)保存到mysql的方法
這篇文章主要為大家詳細(xì)介紹了Bootstrap富文本組件wysiwyg數(shù)據(jù)保存到mysql的方法，感興趣的小伙伴們可以參考一下2016-05-05
JavaScript實(shí)現(xiàn)打開(kāi)鏈接頁(yè)面的方式匯總
這篇文章主要介紹了JavaScript實(shí)現(xiàn)打開(kāi)鏈接頁(yè)面的方式，非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下2016-06-06
文章實(shí)現(xiàn)的div拖拽程序可以根據(jù)按鈕來(lái)控制是要種拖拽方式與位置 ，下面希望有需要的朋友可參考2014-01-01
這篇文章主要介紹了深入理解javascript的getTime()方法,需要的朋友可以參考下2017-02-02
DD_belatedPNG,IE6下PNG透明解決方案(國(guó)外)
今天介紹DD_belatedPNG,只需要一個(gè)理由,就是它支持backgrond-position與background-repeat.這是其他js插件不具備的.2010-12-12
利用D3.js實(shí)現(xiàn)最簡(jiǎn)單的柱狀圖示例代碼
D3.js是一個(gè)基于數(shù)據(jù)操作文檔JavaScript庫(kù)。D3幫助你給數(shù)據(jù)帶來(lái)活力通過(guò)使用HTML、SVG和CSS。D3重視Web標(biāo)準(zhǔn)為你提供現(xiàn)代瀏覽器的全部功能，而不是給你一個(gè)專有的框架。最近在學(xué)習(xí)D3.js，這個(gè)例子是通過(guò)d3.js畫一個(gè)簡(jiǎn)單的柱狀圖。下面來(lái)一起看看吧。2016-12-12
JavaScript中的另一個(gè)機(jī)制：cookie，則可以達(dá)到真正全局變量的要求。 cookie是瀏覽器 提供的一種機(jī)制，它將document 對(duì)象的cookie屬性提供給JavaScript?？梢杂蒍avaScript對(duì)其進(jìn)行控制，而并不是JavaScript本身的性質(zhì)。2008-05-05
微信小程序?qū)崿F(xiàn)同時(shí)上傳多張圖片
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)同時(shí)上傳多張圖片，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-02-02 
本文為大家介紹下js如何獲取IP和PcName在IE下測(cè)試，代碼如下，有需要的朋友可以參考下，希望對(duì)大家有所幫助
2013-08-08