Ionic 2 - Full Screen Issue on Android and Chrome - javascript

I have an ionic 2 app which contains sections like Google Maps, html5 YouTube, Video, and Mp4 Video. Full Screen Control on all of them is not working and giving blank page. This is the YouTube example. I tried allowfullscreen="" or allowfullscreen="true" but still no luck. I tried to research but couldn't find a solution.
<iframe width="80%" height="600" [src]='CurrentResource.YoutubeIdURL'
frameborder="0"
allowfullscreen="allowfullscreen"
mozallowfullscreen="mozallowfullscreen"
msallowfullscreen="msallowfullscreen"
oallowfullscreen="oallowfullscreen"
webkitallowfullscreen="webkitallowfullscreen">
</iframe>

Related

Vimeo video autoplay is not working on iPhone

I have a landing page where I added a background video. This video is hosted on vimeo platform.
Video autoplay is completely working on all devices except iPhone mobile. So please suggest me the solution to autoplay background video on iPhone mobile.
Please check following iFrame code -
<iframe src="https://player.vimeo.com/video/479105292?autoplay=1&background=1&hd=1&loop=1&title=0&byline=0&portrait=0&muted=1&playsinline=1" frameborder="0" data-fullscreeneo="" frameborder="0"allow="autoplay; fullscreen" fullscreen webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Youtube Video Embed iframe shows the wrong video

I am making a website and I have to show a video on its homepage. The video exists on youtube and I need to embed it on my website.
<html>
<iframe width="560" height="315" src="https://www.youtube.com/embed/spPdelVEs_k?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</html>
Unfortunately my webpage shows a completely different video. It shows this one.
https://www.youtube.com/watch?v=7sNL0T93ItM
Does the URL convert to something different? Help me solve this problem.
Your code is fine. You just need to clear the cookies on your browser and then it should load fine for you.
This is the video your code goes to:
https://www.youtube.com/watch?v=spPdelVEs_k

CKEditor Show HTML Code using Youtube plugin

I installed CKEditor, YouTube plugin and Iframe plugin, the video shows up and I can even play the video when I was creating. But when I want to save the page it displays this code HTML.
<iframe allowfullscreen="" frameborder="0" height="360" src="//www.youtube.com/embed/ykCZtyks6NY" width="640"></iframe>
I hope you can help me,
sorry for my bad english.

Play iframe video in full screen automatically

I have an iframe like so:
<iframe width="100%"
height="100%"
src="~/Video/video.mp4"
frameborder="0"
allowfullscreen="true" webkitallowfullscreen="true" mozallowfullscreen="true"></iframe>
I am running this on google chrome. Is there away with jquery or javascript to make this full screen when the video starts playing?

Full screen does not work on a Youtube/Viemo embedded video on my site when using chrome

On my website, I embedded a Youtube video with this simple code:
<iframe width="560" height="315" src="//player.vimeo.com/video/72625639?wmode=opaque" class="st_public_video top1" frameborder="0" allowfullscreen=""></iframe>
Site Demo can be seen here at: https://testvillage.letsventure.com/dreamon
When in Chrome and I press the full screen button on that video, the video goes full screen and again restores automatically.
However, when I use Explorer or Firefox, full screen works just fine. So obviously I'm doing something wrong. Any help would be appreciated.
You need to change the allowfullscreen="" to allowfullscreen.
I have not verified this locally. But this property behaves similar to "selected" in the "select/options".
The following is the syntax from Vimeo.
<iframe src="//player.vimeo.com/video/VIDEO_ID" width="WIDTH" height="HEIGHT" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
Note the tags ebkitallowfullscreen, mozallowfullscreen, allowfullscreen.

Categories