Youtube Embed prevents fullscreen on mobile devices

I am creating a website that should support the full and mobile versions, and on some pages there is an iframe iframe:

<iframe id="yt-video" width="853" height="480" src="//www.youtube.com/embed/M7lc1UVf-VE?rel=0" frameborder="0"></iframe>

Some mobile devices with smaller screens seem to matter if they play video in full screen. Is there a way to prevent it and play the video normally?

I tried using object embed:

<object width="640" height="360">
    <param name="movie" value="https://www.youtube.com/v/M7lc1UVf-VE?version=3"</param>
    <param name="allowFullScreen" value="true"></param>
    <param name="allowScriptAccess" value="always"></param>
    <embed src="https://www.youtube.com/v/M7lc1UVf-VE?version=3" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="640" height="360"></embed>
</object>

It works the way I want, but the problem is that the video is not optimized for mobile devices, and it lays down significantly, at least on my phone, and it is almost impossible to watch.

Thank you in advance!

+4
source share

All Articles