视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
JS实现全屏预览F11功能的示例代码
2020-11-27 22:11:15 责编:小采
文档


老是不通过,没办法,只能是重新发布了,反正我就是杠上了,大大小小写过很多前端特效,当然也经常在网上copy或者修改人家的代码,我觉得也挺好的,为什么?!因为我想这样,你能怎么办,打我?

少废话,直接上代码,

JS代码

function fullScreen(el) {
 var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen,
 wscript;
 
 if(typeof rfs != "undefined" && rfs) {
 rfs.call(el);
 return;
 }
 
 if(typeof window.ActiveXObject != "undefined") {
 wscript = new ActiveXObject("WScript.Shell");
 if(wscript) {
 wscript.SendKeys("{F11}");
 }
 }
}
 
function exitFullScreen(el) {
 var el= document,
 cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen,
 wscript;
 
 if (typeof cfs != "undefined" && cfs) {
 cfs.call(el);
 return;
 }
 
 if (typeof window.ActiveXObject != "undefined") {
 wscript = new ActiveXObject("WScript.Shell");
 if (wscript != null) {
 wscript.SendKeys("{F11}");
 }
 }
}

HTML代码

最近受了一点点小刺激,对自己做的工作产生迷茫,不知道还要做这个做多久,还有我其实还是喜欢设计多一些,还有我喜欢设计,但是设计太难了,经常觉得自己做的东西跟别人的,比起来差个好几万块钱,Why?你问我,我问谁。好吧,我也很无赖。

举个小小例子,随便来一个按钮试试,按钮上在来个点击事件切换。

<html id="Content">
 <body>
 <ul>
 <li>
 <a id="BtnFullOpen" href="javascript:void(0);" rel="external nofollow" rel="external nofollow" title="按“F11”进入全屏模式">
 <i class="ace-icon fa fa-arrows-alt"></i>全屏查看
 </a>
 <a id="BtnFullQuite" href="javascript:void(0);" rel="external nofollow" rel="external nofollow" title="按“F11”关闭全屏模式" style="display:none;">
 <i class="ace-icon fa fa-arrows-alt"></i>全屏关闭
 </a>
 </li>
 <li>2</li>
 <li>3</li>
 <li>5</li>
 </ul>
 </body>
</html>

记得一定要加上调用代码,调用代码,调用代码,说三遍...

JS调用代码

var oBtnFullOpen = document.getElementById('BtnFullOpen');
var oContent = document.getElementById('Content');
oBtnFullOpen.onclick = function() {
 fullScreen(oContent);
 oBtnFullQuite.setAttribute("style", "display:block");
 oBtnFullOpen.setAttribute("style", "display:none");
}
var oBtnFullQuite = document.getElementById('BtnFullQuite');
oBtnFullQuite.onclick = function() {
 exitFullScreen(oContent);
 oBtnFullQuite.setAttribute("style", "display:none");
 oBtnFullOpen.setAttribute("style", "display:block");
};

只做个人备忘,不做任何发表,不做信息交流。

下载本文
显示全文
专题