0

I'm using Youtube's iframe API to load videos on our site. I also have another iframe where this happens. The Youtube iframes are above the fold, but the browser doesn't render them until you swipe down just a little. I've put an animated icon and message to help users, but this looks silly because you only need to scroll ever so slightly.

I've tried multiple "fixes", but none seem to work. The fix to add -webkit-transform: translate3d (0,0,0) does not work (can be seen here in many incarnations iPad Safari scrolling causes HTML elements to disappear and reappear with a delay).

I'm starting this new question because, although the above link is marked as answered, the answer no longer works, or is not valid. The part that makes the least sense is the content is actually about the fold.

Thanks for the help all.

EDIT: Also noting that I have tried making the page scroll via js. It seems that the browsers on iOS actually wait for user input before rendering the iframe. Weirdness.

Community
  • 1
  • 1
naphier
  • 256
  • 2
  • 13
  • Can you please add the code you are using to embed the I frame – YankTHEcode Jul 09 '16 at 01:48
  • You're not going to be able to glean much from it. It's youtube's iframe API. If interested you can see the example on their site. It's basic, doesn't really tell you anything about this situation as this is behaviour for all iframes on iOS. You can just place an iframe in html where it will be initially placed below the fold (off screen) and see the effect. – naphier Jul 09 '16 at 07:09
  • Maybe if you have the page automatically scroll down a few pixels? I have never done it, but this page may be useful: http://scraping.pro/make-web-page-to-auto-scroll-down/ – Carol McKay Jul 09 '16 at 08:31
  • Ah thanks for that. I didn't note in my question that I had tried it. Even scrolled to the dom's point. No avail. – naphier Jul 09 '16 at 18:26

0 Answers0