Scroll Iframe to the top of the page

From Beds24 Wiki
Revision as of 12:58, 17 July 2015 by Beds24>Annette
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
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=11709"