iPhone open pop-up and loading problem

[sumanengbd]

The problem is when I'm browsing with the iPhone. All other devices are not having any problems. Even after the page is loaded, loading loading loading is showing. If you click on the play button, it is not playing.

Although loading is complete on some devices, clicking on the play button will open a popup. There is no problem with Windows and Android.

My code -

var os = ['iphone', 'ipad', 'windows', 'mac', 'linux'];
var match = navigator.appVersion.toLowerCase().match(new RegExp(os.join('|')) );

$("#screenVideo").YTPlayer({
  autoPlay: match[0] == 'iphone' ? false : true,
  containment: 'self',
  showControls: false,
  startAt: 0,
  mute: true,
  loop: true,
  opacity: 1,
  showYTLogo: false,
  useOnMobile: true,
  gaTrack: false,
  optimizeDisplay: false,
  events: {
    'onReady': onPlayerReady
  }
});

function onPlayerReady(event) {
  event.target.playVideo();
}

Link - https://gcdev3.com/giswebtech/

How can I fix this problem?

https://user-images.githubusercontent.com/11748655/109962193-1846a400-7d15-11eb-80da-d150d279d7f6.mp4