当浏览器处于全屏模式时，如何禁用所有链接？

Question

当浏览器 (Chrome / IE) 在 full-screen mode 时，我如何禁用所有 link？

因为当用户在我的网页上点击link（www/pdf link）时，他会重定向到另一个不包含[=的页面21=] 按钮在全屏模式下返回上一页。并且需要全屏模式才能访问我的网页。

谢谢！

Answer 1

您可以使用 CSS3 fullscreen 来禁用链接。

PS：上面的示例在 Whosebug iframe 中不起作用。您需要将代码复制到文件中然后对其进行测试。

:fullscreen a[href] {
  pointer-events: none;
  cursor: default;
  color: black;
  text-decoration: none;
}

<a href="#">Will be disabled on fullscreen</a>
<button onclick="document.body.requestFullscreen();">Go fullscreen</button>

Answer 2

您可以通过此操作了解屏幕是否处于全屏模式...

if((window.fullScreen) ||
   (window.innerWidth == screen.width && window.innerHeight == screen.height)) {
     //code goes here
} else {
     // Code goes here
}

您可以覆盖锚标记的 onclick 功能或删除 href 属性。

Answer 3

尝试使用以下代码检测全屏模式，然后禁用超链接。

window.addEventListener('resize', function(){
    if((window.fullScreen) || (window.innerWidth == screen.width && window.innerHeight == screen.height)) {
        // browser is fullscreen 
        console.log('fullScreen!');
        //disable hyperlink
        $('a').bind("click.myDisable", function() { return false; });
    } else {
        console.log('no fullScreen!');
    }
});

[注意]以上代码使用了window的resize事件，也可以在页面加载事件中加入if条件语句，在页面加载时判断页面是否全屏。

有关enable/disable超链接的更多详细信息，请查看this thread。

当浏览器处于全屏模式时，如何禁用所有链接？

How can I disable all links when the browser is in full screen mode?

javascript

google-chrome

internet-explorer

browser

fullscreen