Question

原谅我，我甚至不确定问题的正确术语（或谷歌）。

我目前拥有的是家庭自动化的一些HTML和Java脚本代码。当我点击链接时，我的代码加载了一个进度条动画，执行自动化脚本，然后执行一个＆＃39; window.history.back（）＆＃39;重新加载上一页。

我想要做的是当我点击链接时，我想留在当前页面上，但是将我的页面和动画加载为＆＃34;半透明叠加层。

要明确的是，当前浏览器窗口中的内容可以是任何页面（我 cant 控制内容）。我可以控制我正在加载的链接中的内容。

由于

Answer 1

问题有点模糊，我可能会误解。您可以将原始页面加载到iframe中，并为其设置自己的内容。

.overlay{
  position:fixed;
  width:100%;
  height: 100%;
  background-color:rgba(0, 0, 0, 0.6);
  pointer-events: none;
}

.banner{
  text-align:center;
  background-color:green;
  font-size:20px;
  color:white;
}

<div class="overlay">
  <div class="banner">
  your overlay shenanigans 
  </div>

</div>
<iframe src="https://www.wsj.com/europe"  onload="this.width=screen.width;this.height=screen.height;"/>

你会遇到问题，但iframe非常有限且some sites outright block it。

还有其他选择：
大多数浏览器允许安装插件/插件，允许您在任何页面上运行任意javascript 也可以通过将其位置设置为javascript:%20{alert('hello')}而不是网址来从书签执行javascript。
您可以使用javascript将自己的元素/叠加层添加到当前页面。

在任何网页上创建半透明叠加层

1 个答案: