阻止页面跳转到iframe [英] Prevent page to jumping to iframe

问题描述

我正在尝试通过iframe将wetransfer整合到一个网站中，但是当页面加载时我遇到了问题，它在页面中间跳了一半，所以它专注于iframe，而不是在顶部打开页面。

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

使用jquery我试过$（ 'HTML'）scrollTop的（0）。在启动iframe后，它仍然无效。

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

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

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

HTML

 < header> 
一些页眉信息和导航
< / header> 
< div class =main> 
< iframe src =https://www.wetransfer.com/width =100％height =700frameborder =0>< / iframe> 
< / div> 
  

CSS

 标题{
背景：绿色; 
身高：600px; 
} 
  

解决方案

你可以在您的页面顶部是这样的：

HTML

 <报头GT; 
< a id =focushref =＃focus>< / a> 
一些页眉信息和导航
< / header> 
  

在页面加载时使用此JS：

<$ 。p $ p> 的document.getElementById（ 焦点）聚焦（）;


I'm trying to integrate wetransfer into a website through an iframe, but I'm having a problem when the page loads, it jumps half-way down page, so it focuses on the iframe, instead of opening at the top of the page.

From what I can tell, there is a script on the wetransfer site that's telling it to jump to that section, instead starting at the top of the page. How can I get it to ignore the script by wetransfer or after the iframe's loaded to tell it to move back to the top of the page?

With jquery I tried $('html').scrollTop(0); after initiating the iframe, but it still doesn't work.

On the website I have jquery calculate the height of the user's screen and then set the header to that size, with a full background and navigation and than the iframe starts below that. So setting the position to absolute or anything along those lines, wouldn't work.

I created a very simple jsfiddle example just to show how the page opens scrolled halfway down the page. It only does this when the iframe source is wetransfer and not with any other source.

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;
}

解决方案

You can put an anchor at the top of your page like this:

HTML

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

On page load use this JS:

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

这篇关于阻止页面跳转到iframe的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！