Question

我试图通过iframe将wetransfer整合到一个网站中，但是我在页面加载时遇到问题，它会向下跳一半，所以它会关注iframe，而不是在页面顶部打开。

据我所知，在wetransfer网站上有一个脚本告诉它跳转到该部分，而不是从页面顶部开始。如何通过wetransfer或iframe加载后忽略脚本以告诉它移回页面顶部？

使用jquery我尝试了$（＆＃39; html＆＃39;）。scrollTop（0）;在启动iframe之后，它仍然无法正常工作。

在网站上，我有jquery计算用户屏幕的高度，然后将标题设置为该大小，具有完整的背景和导航，并且iframe从下面开始。因此，将位置设置为绝对位置或沿着这些位置的任何位置都不会起作用。

我创建了一个非常简单的jsfiddle示例，只是为了显示页面在页面中间滚动的方式。只有当iframe源是湿转移且没有任何其他来源时才会这样做。

https://jsfiddle.net/dbruning22/c0s6mhkv/6/

HTML

<header>
  Some Header information and navigation
</header>
<div class="main">
  <iframe src="https://www.wetransfer.com/" width="100%" height="700" frameborder="0"></iframe>
</div>

CSS

header { 
  background: green;
  height: 600px;
}

Answer 1

您可以将锚点放在页面顶部，如下所示：

HTML

<header>
<a id="focus" href="#focus"></a>
  Some Header information and navigation
</header>

在页面加载时使用此JS：

document.getElementById("focus").focus();

Answer 2

这是＆＃34; hack＆＃34;完全禁用自动滚动，只需将函数window.scrollTo()重新定义为无操作：

window.scrollTo = function () {};

Answer 3

这对我有用：

1）您最初通过将显示设置为无来隐藏iframe：

<iframe id="bmap" src="xxx.xxxx.xxx" style="display:none;"  frameborder="0">

2）页面加载完毕后，请使用jquery或javascript显示iframe：

window.onload = function ()
{
    $("#bmap").show();
}

这对我来说适用于所有浏览器

Answer 4

由于经过大量测试后以上都不对我有用，这是另一个窍门，因为许多站点现在都具有“滚动到顶部”按钮，如果页面结构无法轻松修改（如wordpress主题，则非常有用）... ）：

  jQuery(".scroll-top-button").trigger("click");

只需要强制单击该按钮即可...实际上是跨浏览器的：-）（当然，如果支持jquery）....

阻止页面跳转到iframe

4 个答案: