Return to previous page

Youtube iOS (iPhone and iPad) compatibility issue

This topic has 4 replies, 3 voices, and was last updated 10 years, 3 months ago ago by Jack Richardson

zf

Participant

September 17, 2015 at 14:09

Hi Guys, I seem to be having a strange “problem” with embedded Youtube videos and any iOS devices.
What is happening is that embedded youtube videos do not play on any of these devices. I have done some digging and come accross this link – It seems like this is quite a common issue with different solutions.

I have Nex – Forms running on all my pages of the site and have tried disabling the forms and video then plays. However this is not an option for me as the forms are an integral part of the sites structure.

It seems that a second alternative may work where we remove “webkit-tap-highlight-color” from the css. That may work as most browsers run mobile web-kit. What i need to know is that what impact would it have if any on the theme if we do comment this out of the code.

N.B – Strangely enough it seems to work on Android devices.

Links in Private content

Thank You

Please, contact administrator
for this information.

#87560 Copied

3 Answers

Eva Kemp

Participant

September 17, 2015 at 14:43

Hello,

Please refer to this article:
http://demosthenes.info/blog/777/Create-Fullscreen-HTML5-Page-Background-Video

Displaying the fullscreen background video on mobile devices presents several challenges:

Most mobile platforms (iOS in particular) will refuse to autoplay HTML5 video to avoid potentially ruinous data charges.
In such cases the video will be displayed with an embedded play button, which in turn…
…may capture touches on the device, locking out links that may be in the content on top of the video.
While it is possible to feature-detect support for video autoplay with JavaScript (a technique I will cover in a future article), the easiest solution is to use a media query that switches off the video entirely on smaller screens, substituting the placeholder image in the background.

Removing class “webkit-tap-highlight-color” will disable highlight of a tapped link.

Regards,
Eva Kemp.

#87575 Copied

zf

Participant

September 22, 2015 at 13:35

Hi Eva, i think you may have misunderstood my query. The videos are not using any plugin.
All videos are embedded youtube videos. Normal size 555×312 and not full screen, they do not play at all on iOS devices i.e iPad and iPhone. The videos are also not set to autoplay – they are all click to play via youtube embed.

Please advise and apologies for not explaining clearly the last time around/

Thank you

Please, contact administrator
for this information.

#88609 Copied

Jack Richardson

Support staff

September 22, 2015 at 15:23

Hello,

Sorry, but this bug isn’t related to the theme. We recommend you to try one of the solutions described in the page you provided.

Best regards,
Jack Richardson.

#88627 Copied
Viewing 4 results - 1 through 4 (of 4 total)