如何在我的 Web 应用程序中的某些页面上全屏显示



在我的应用程序中,我想让一些页面全屏显示。 基本上这就是我想要的: "用户无法使用鼠标访问浏览器或计算机桌面或在窗口外执行任何其他操作"。

我正在尝试使用此全屏API: https://www.npmjs.com/package/screenfull

我正在使用html5/angular 5。我按照 API 页面上的角度示例中的建议制定了一个指令。例如,我在第 3 页上使用了带有按钮(转到下一页(的选择器"切换全屏"。如果我想要第 4 页和第 5 页的全屏显示。而不是将选择器放在第 3 页上,下一个按钮将我带到第 4 页应该在第 4 页上全屏显示。但它不起作用。第 4 页不全屏显示。

我对棱角很陌生。那么任何人都可以建议一些其他方法在我的代码中实现此功能吗?我不知道为什么这个 API 对我不起作用。

toggleFullScreen() {
let elem =  document.body; 
let methodToBeInvoked = elem.requestFullscreen || 
elem.webkitRequestFullScreen || elem['mozRequestFullscreen'] 
|| 
elem['msRequestFullscreen']; 
if(methodToBeInvoked) methodToBeInvoked.call(elem);
}

在要触发全屏的任何位置调用此函数,例如在提交按钮单击上调用此方法,该方法将全屏加载页面

相关内容

  • 没有找到相关文章

最新更新