Youtube iframe in jquery mobile + phonegap build

Question

I use iframe to embed youtube videos in an Android and iOS app developed using jQuery for mobile and phone conversations.

Testing it in my browser works fine.

On my device (Android) I see a thumbnail of the video, but when I click on it, the screen turns black, I see the controls (play, fast forward and rewind), and the video does not start. In some other video, I see a downloadable "circle", and then videos related to YT.

I check that the video is available for mobile devices

  http://gdata.youtube.com/feeds/videos?alt=json&format=1,6&fields=entry[link/@rel='http://gdata.youtube.com/schemas/2007%23mobile'†&max-result = 10 & category = Music & q = "+ mySong 

Any help would be really appreciated.

Answer 1

The problem seemed to be related to the Android version: on version 4.0, the iframe / html5 version worked fine. The problem was in Android 2.3.

I used the jqm plugin as a workaround in 2.3

Answer 2

This tutorial seems to work:

http://eisabainyo.net/weblog/2012/01/24/embed-a-youtube-video-iframe-in-phonegap-app/

Pay attention to this step:

Change / add the following values ​​to the PhoneGap.plist file of your application.

MediaPlaybackRequiresUserAction: NO AllowInlineMediaPlayback: YES OpenAllWhitelistURLsInWebView: YES ExternalHosts *.youtube.com *.ytimg.com