栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

通过javascript将窗口设置为全屏(REAL全屏; F11功能)

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

通过javascript将窗口设置为全屏(REAL全屏; F11功能)

现在可以在最新版本的Chrome,Firefox和IE(11)中实现。

按照Zuul在该线程上的指针,我编辑了他的代码,以包括IE11和全屏显示您页面上所选元素的选项。

JS:

function toggleFullScreen(elem) {    // ## The below if statement seems to work better ## if ((document.fullScreenElement && document.fullScreenElement !== null) || (document.msfullscreenElement && document.msfullscreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) {    if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {        if (elem.requestFullScreen) { elem.requestFullScreen();        } else if (elem.mozRequestFullScreen) { elem.mozRequestFullScreen();        } else if (elem.webkitRequestFullScreen) { elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);        } else if (elem.msRequestFullscreen) { elem.msRequestFullscreen();        }    } else {        if (document.cancelFullScreen) { document.cancelFullScreen();        } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen();        } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen();        } else if (document.msExitFullscreen) { document.msExitFullscreen();        }    }}

HTML:

<input type="button" value="click to toggle fullscreen" onclick="toggleFullScreen(document.body)">

其中“ document.body”是您希望的任何元素。

另请注意,尝试从控制台运行这些全屏命令似乎不适用于Chrome或IE。我在Firefox中使用Firebug确实取得了成功。

需要注意的另一件事是这些“全屏”命令没有垂直滚动条,您需要在CSS中指定此滚动条:

*:fullscreen*:-ms-fullscreen,*:-webkit-full-screen,*:-moz-full-screen {   overflow: auto !important;}

“!重要”似乎是IE渲染它所必需的



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/390623.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号