[resolved] Page Load Affected by iframe (2 posts)

  1. Jeremiah
    Posted 3 years ago #

    I built a plugin for my company's customers and one of the options uses an iframe. A customer pointed out an interesting issue to me. When the page loads, it doesn't load at the top but loads just above the iframe (please see: http://salondshayn.com/wp/staff/jude-hair-stylist-hairdresser-scottsdale/). The same thing happens on my test site, and in all browsers I've tested (chrome, i.e. and firefox).

    I've narrowed it down to the iframe, but I have no idea how to fix this. The closest thing I've found is this article, but the only fix it offers is to not use an iframe. http://wordpress.org/support/topic/pages-react-as-if-theres-an-anchor-in-firefox?replies=9#post-1347129

    Any suggestions?


  2. Jeremiah
    Posted 3 years ago #

    I ended up finding (two weeks later) the answer to this question. I took it from Nate's answer here - http://stackoverflow.com/questions/6596668/iframe-on-the-page-bottom-avoid-automatic-scroll-of-the-page/7148477#7148477

    I used:

    <iframe style="position: absolute; top: -9999em; visibility: hidden;" onload="this.style.position='static'; this.style.visibility='visible';" href="..."></iframe>

    It seems to have completely eliminated the scrolling issue.

    Here was Nate's quote:

    Here we're basically saying hiding the frame and moving it to a negative offset on the page vertically. When it does try to focus the element inside of the frame, it should scroll the page upward, then once loaded place the iframe back in it's intended position.

Topic Closed

This topic has been closed to new replies.

About this Topic