js如何监听浏览器全屏时退出按钮事件?
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js如何监听浏览器全屏时退出按钮事件?相关的知识,希望对你有一定的参考价值。
如下图所示,在浏览器全屏时,鼠标往上拉,会出现x的按钮,点击可以退出全屏,我想知道js如何监听这个按钮的点击事件,或是有没有什么办法可以禁用或是隐藏这个按钮?
参考技术A 点击按钮退出全屏,这个点击事件就好了呗,这是最简单的事件了,至于按钮为什么出现,你可以仔细看看是鼠标到达页面顶端,按钮才出现的,明白了吧追问不明白,上demo?
追答你想说的是点击退出按钮退出全屏?还是为什么鼠标到达顶部弹出按钮?
追问后一个
追答js获取了鼠标的位置、页面的高度,当鼠标的位置高度为0的时候,就弹出按钮
参考技术B 出于安全性和用户体验考虑,浏览器会严禁脚本程序阻止用户退出全屏模式的(不管出于什么目的),所以你不用费心机去想了,放弃吧jquery “做页面滚动到某屏时改变状态标题” 所用知识点记录
浏览器滚动条滚动时触发事件
//浏览器滚动条滚动时触发事件 $(window).scroll(function(){});
浏览器窗口大小改变时触发事件
//浏览器窗口大小改变时触发事件 $(window).resize(function(){});
监听所有锚点链接实现平滑移动
//监听所有锚点链接实现平滑移动 $(\'a[href*=#],area[href*=#]\').click(function() { if (location.pathname.replace(/^\\//, \'\') == this.pathname.replace(/^\\//, \'\') && location.hostname == this.hostname) { var $target = $(this.hash); $target = $target.length && $target || $(\'[name=\' + this.hash.slice(1) + \']\'); if ($target.length) { var targetOffset = $target.offset().top; //为提升用户体验,做出算法改进 start var clientHeight = document.body.clientHeight; //浏览器可视高度 targetOffset = targetOffset-(clientHeight/2)+100; //end $(\'html,body\').stop(true).animate({ scrollTop: targetOffset }, 1000); return false; } } });
获取某元素基于当前浏览器窗口底部的距离
//获取某元素基于当前浏览器窗口底部的距离 function get_element_window_bottom(choose){ if(choose==\'\') return false; mTop = $(choose)[0].offsetTop; sTop = $(window).scrollTop(); result = mTop - sTop; //增加一个算法提高用户体验度 result = result+parseInt(document.body.clientHeight/2); return result; }
效果实例图
以上是关于js如何监听浏览器全屏时退出按钮事件?的主要内容,如果未能解决你的问题,请参考以下文章