iframe页面顶部
[英]the top of the page from iframe
问题描述
is there any way how to make link inside iframe to control main page. 
有什么方法可以在iframe中建立链接以控制主页。 I need to make a link from iframe that makes main page go to the top. 我需要从iframe建立一个链接，使主页转到顶部。
For example 例如
<html> <- mainpage
...some arcticle...
<iframe>
...long article...
<a href="goback">Go Back</a>
</iframe>
</html>
After clicked to "Go Back" I need to scroll to the top of main page (not just iframe) 点击“返回”后，我需要滚动到主页顶部（而不仅仅是iframe）
I can't use "back to the top" link inside mainpage, it has to be in iframe. 我不能使用主页内的“返回顶部”链接，它必须位于iframe中。
Thank you :) 谢谢 ：）
4 个解决方案
解决方案1
1 2016-05-27 09:31:15
You can jump to the top of a page by using the id attribute in elements. 您可以通过使用元素中的id属性来跳至页面顶部。
<html id="top">
<!-- Some content here -->
<iframe>
<!-- Long Article here -->
<a href="#top">Jump to top</a>
</iframe>
</html>
解决方案2
1 2016-05-27 09:32:03
This cannot be done within iframe. 无法在iframe中完成此操作。 You cannot control the iframe from parent page and vice versa. 您无法从父页面控制iframe，反之亦然。
解决方案3
1 2016-05-27 10:52:18
Your link inside the iframe should be the following 您在iframe中的链接应为以下内容
<a href="http://full-address-of-the-parent-page/#top" target="_parent">go back</a>
Important factors are the _parent value of the target attribute and that the href contains the full URL of the parent page, otherwise the browser will redirect the parent page to the framed document's URL (+ anchor). 重要因素是target属性的_parent值，并且href包含父页面的完整URL，否则浏览器会将父页面重定向到框架文档的URL（+锚）。 Not sure if every browser does the jump only or there will be full page reload, though. 不确定每个浏览器是否仅执行跳转，还是会重新加载整个页面。
If both documents are of the same origin (see JavaScript's same-origin policy), then it could also be done via script, eg 如果两个文档的来源相同（请参见JavaScript的同源政策），则也可以通过脚本来完成，例如
window.parent.scrollTo(0, 0);
解决方案4
0 2016-05-27 09:33:58
I think it works! 我认为它有效！
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> <script> $(document).ready(function () { $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('.scrollup').fadeIn(); } else { $('.scrollup').fadeOut(); } }); $('.scrollup').click(function () { $("html, body").animate({ scrollTop: 0 }, 600); return false; }); }); </script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.