CODEWITHSUNDEEP
javascriptyoutubeyoutube-api
Rune
Rune

Reputation: 21

Youtube API pause when i press play in some mobile browser

I have been working with youtubes javascript api for a webpage and everything has been working great. Today I noticed a problem which has not been present before. On some mobile browsers for instance firefox on Android the youtube players only works ones. If I press play(on the video) it start playing and if press pause it stops. But if I press play again it play a couple of frames and pause again. I think it is a new problem as I have done a lot of testing the last couple of weeks. Here is my code for creating the players.

//Start Youtube API
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

var youtubeReady = false;

//Variable for the dynamically created youtube players
var players= new Array();
var isPlaying = false;
function onYouTubeIframeAPIReady(){
     youtubeReady = true;
    //The id of the iframe and is the same as the videoId 
    jQuery(".video").each(function(i, obj) {
      players[obj.id] = new YT.Player(obj.id, {         
            videoId: obj.id,
          playerVars: {
              controls: 0,
              showinfo: 0 ,
              modestbranding: 1,
              wmode: "transparent",
              html5: 1
           },   
           events: {
                'onStateChange': onPlayerStateChange
           }
        });
     });
  }

Upvotes: 1

Views: 220

Answers (1)

Rune
Rune

Reputation: 21

Ok so I found the cause of the problems. I experinced problem in Firefox for Android and the standard browser on Samsung Galaxy S3. My setting was that youtube player had control=0 so all play and pause interaction is done by pressing the iframe/video image

In firefox the problem was that if I played the video, paused and played it again it would play for a couple of frames an pause for no reason. The cause of the problem was this line:

tag.src = "http://www.youtube.com/iframe_api";

If i change http to https it works. The same problem occur when using regular embeds if you do not link to the video with https.

However this means that the user has to activate the plugin before the video is visible and it furthermore seems to be another more laggy player that appears... When reading in forums it seems that a lot of people have problem with youtube embeds with firefox for android.

For the samsung s3 browser the problem was kind of the opposite. When playing a video and pausing it would rewind a couple frames and play again for no reason. I found that the problem was with the "control=0" parameter. If I change this to "control=2" it works, so if I want to support this browser I need to rethink my design. It do not seems to work...

Upvotes: 1

Related Questions