Scroll Iframe to the top of the page

From Beds24 Wiki
Jump to navigation Jump to search 
This page explains how to scroll an iframe to the top of the page

Requires: Knowledge of HTML, Javascript

When a long page inside an iframe changes to a shorter page, the guest viewing the page might be left at the bottom looking at what appears to be a blank page. Possibilities to access and control the Iframe from outside (your website) are limited. What you could do:

  • Add onload="window.parent.parent.scrollTo(0,0)" to the Iframe. For example:

<iframe onload="window.parent.parent.scrollTo(0,0)" style="max-width: 100%; border: none; overflow: auto;" src="https://www.beds24.com/booking2.php?propid=3103&numdisplayed=5&numnight=1&numadult=2-1&referer=iframe/" height="1500" width="800"></iframe>

  • Reduce the height of the embedded booking page or the iframe. Keeping the iframe small and allowing scroll bars to navigate inside it can work well.
  • Web developers can create a custom landing page after the booking. The setting is SETTINGS -> BOOKING PAGE -> PAGE DESIGN -> BEHAVIOUR "Booking Return URL". Information about the booking is passed to your page as URL parameters which you could extract and display on your page.
Retrieved from "http://co-reception.com/wiki/index.php?title=Scroll_Iframe_to_the_top_of_the_page&oldid=11710"