the top of the page from iframe
Question
is there any way how to make link inside iframe to control main page. I need to make a link from iframe that makes main page go to the top.
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)
I can't use "back to the top" link inside mainpage, it has to be in iframe.
Thank you :)
4 answers
solution1
1 2016-05-27 09:31:15
You can jump to the top of a page by using the id attribute in elements.
<html id="top">
<!-- Some content here -->
<iframe>
<!-- Long Article here -->
<a href="#top">Jump to top</a>
</iframe>
</html>
solution2
1 2016-05-27 09:32:03
This cannot be done within iframe. You cannot control the iframe from parent page and vice versa.
solution3
1 2016-05-27 10:52:18
Your link inside the iframe should be the following
<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). 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
window.parent.scrollTo(0, 0);
solution4
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>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.