On iPhones when playing a video in safari the standard is that apple opens a fullscreen video player and plays the video there like here:
In my case i dont want that, i just want to let the video play in the html in safari without opening the videoplayer:
How do you prevent a video to open in the apple standard video player?
Is it possible?
This is the video:
<video id="video-m-1" class="video" preload="none" poster="dist/Images/Weltkugel_Initial_Mobile_v2.png">
<source src="dist/Videos/Kugel-Ganz-1.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
Apple has finally enabled the playsinline attribute on iOS 10, so this will work:
<video src="file.mp4" playsinline>
the video will not be opened in the video player, it will lay inline in the html
Related
I'm using the Instagram API to pull posts to a website. If it's a video post I'm using (simplified)
<video id="id123" poster="img.jpg" controls>
<source id="id123" src="instagramURL.mp4" type="video/mp4">
</video>
The controls show in Safari but NOT in Chrome. So the poster image shows but there's no way to play the video unless I put in autoplay muted which mutes the video and, without controls, there's no way to turn on the audio.
How do I get the controls to show?
I'm creating a website using wordpress and I'm trying to add a MP3 music into it.
But the music don't autoplay on mobile. And when I click on pause, the music stop, but if I scroll (on PC or mobile) the music start again and again and again.
Here the html code :
<figure>
<audio
controls
src="https://www.blog-motivation.com/wp-content/uploads/2022/04/ولنبلونكم-بشئ-من-الخوف-والجوع-ونقص-من-الاموال-والانفس-والثمرات-وبشر-الصابرين-اسلام-صبحي.mp3" autoplay>
</audio>
thank you
It is to not use autoplay because it could disturb some peoples, but if you want your audio with autoplay it is better to put source to another tag like this:
<audio controls autoplay>
<source src="https://www.blog-motivation.com/wp-content/uploads/2022/04/ولنبلونكم-بشئ-من-الخوف-والجوع-ونقص-من-الاموال-والانفس-والثمرات-وبشر-الصابرين-اسلام-صبحي.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
It is also possible that your bowser is Chrome and this browser blocs automatically autoplay. To control autoplay in Chrome go here.
Refer here : Audio Tag Autoplay Not working in mobile
Seems autoplay in chrome we need to use resume. it works in Firefox / chrome and target mobile / browser devices.
I have 5 videos in home page of my website, http://stg.ionhealingapp.com/. All videos are playing perfectly in all screen sizes. I have disabled controls and muted the video to start the autoplay. But, the only issue is with iPhone. When ever I am trying to play the videos other than the first video, the video is popping up and controls are visible. I don't want this to happen.
I can see that there is an option to disable "Auto-play video previews" from iOS13.
https://ios.gadgethacks.com/how-to/disable-auto-playing-video-previews-your-iphone-ios-13-0198401/
But couldn't find option to disable this in iOS12 and in earlier versions.
This is my video tag:
<video width="320" height="240" muted loop>
<source src="link to my video" type="video/mp4">
</video>
Is there any option to disable the preview popup from HTML end/iOS end?
I have an HTML5 video embeded in a portfolio I want to autoplay & be muted until sound is initiated, so when a user is scrolling down the page it's already playing but there isn't annoying sound for the user. It is working fine on all browsers on my desktop and tablet, however on iPhone mobile the sound is permanently muted, even when a user tries to adjust the volume. Here here's the code I am using, is there some javascript I can implement/use instead that will solve this?
<video id="cla-generic" preload="auto" onclick="this.paused?this.play():this.pause()" autoplay controls muted loop>
<source src="video.mp4"/>
</video>
Autoplay does not work on iOS and android.
Thats why you are getting no sound.
Take a look at this thread:
iPhone HTML5 Audio tag not working
I am using jquery mobile and video tag to display videos.
My video plays fine on all 'desktop' browsers, but when play when I use the following code in mobile safari (iPhone) it shows only black rectangle without any controls.
I used video used commonly in html5 examples. (from http://www.bigbuckbunny.org) so it shouldn't be encoding issue.
When I access video directly by typing its url http://myurlofvideo.mp4 it plays correctly in mobile Safari.
What's causing the problem?
Thank you in advance!
<video width="75%" id="video1" controls="true" autoplay="true">
<source src="videos/mov_bbb.mp4" type="video/mp4">
<source src="videos/mov_bbb.webm" type="video/webm">
Your browser does not support the video tag.
</video>
I tried the sample below in iphone simulator and it is working ,check it out .
<video width="320" height="240" controls>
<source src="http://techslides.com/demos/sample-videos/small.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
it shows preview image of the video,when you click on it plays in fullscreen.