HTML5 video on mobile phones - Chrome 55 does not autoplay and mute? - android

Chrome browser on my Android phone is version 55. According to this doc, 'Muted autoplay for video is supported by Chrome for Android as of version 53.'
This is my code:
<div class="item-video">
<video width="560" height="315" autoplay muted controls loop playsinline>
<source src="http://video.webmfiles.org/big-buck-bunny_trailer.webm" type="video/webm">
</video>
</div>
Any ideas?
I even tested their sample page on my Android, and not working at all!

Related

Video background showing but not playing on firefox for android

I encountered a problem while trying to use a background video on mobile. Everything works just fine on Chrome and Opera but whenever I try to open the webpage on firefox for android it won't start. It's there but autoplay won't start for some reasons. Can you help me figure out why?
<video width="100%" height="100%" autoplay muted loop>
<source src="images/ECLYPSODark_Side.mp4" type=video/mp4>
<source src="images/ECLYPSODark_Side.ogv" type=video/ogg>
<source src="images/ECLYPSODark_Side.webm" type=video/webm>
</video>
I found a solution to it. If you put the video on mute it autoplays, otherwise it doesn't!

HTML 5 Video not even showing on mobile

Homepage of my moms website, if you open in browser and use console to see the mobile version you will see the video playing... but when you use your actual phone and type this website there is nothing... not even a frozen thumbnail ....... like what the actual functionality ??
Please help I'm so frustrated.... no errors no nothing......
<div class="mobileVideo">
<video id="video" playsinline autoplay loop muted width="auto" height="auto"
preload="auto" style="display:block;" autoplay="autoplay">
<source src="" type="video/mp4">
<source src="https://kavitacijabeograd.com/wp-content/uploads/2020/03/Mobile-Kavitacijabeograd.m4v"
type="video/ogg">
</video>
</div>
Conclusion,
type="video/ogg" is showing while inspecting the page and the video on PC google chroom,
but when you open website on actual phone, video is not showing unless type is video/mp4
hope it helps some1

Videojs in Chrome on Android doesn't show poster

I have a video on this page:
https://job.id/2044/telemarketing-executive-kota-bekasi
On all devices & browsers it works fine except Google Chrome on Android. The poster image does not show. Any suggestion how to get poster image to show?
Videojs viewed using Chrome on Android
Videojs viewed using other browser on Android
The video emdedded as:
<video id="video-1"
class="vjs-tech"
preload="auto"
data-setup="{fluid: true}"
poster="https://d1gajg4ezrqrup.cloudfront.net/live/video/advertiser/1/6/thumbs-cce3c4bb-9b00-4af9-8cb0-07b07201886c-00001.png">
<source src="https://d1gajg4ezrqrup.cloudfront.net/live/video/advertiser/1/6/mp4-cce3c4bb-9b00-4af9-8cb0-07b07201886c.mp4" type="video/mp4">
<source src="https://d1gajg4ezrqrup.cloudfront.net/live/video/advertiser/1/6/hls-cce3c4bb-9b00-4af9-8cb0-07b07201886c.ts" type="video/hls">
<source src="https://d1gajg4ezrqrup.cloudfront.net/live/video/advertiser/1/6/webm-cce3c4bb-9b00-4af9-8cb0-07b07201886c.webm" type="video/webm">
<p class="vjs-no-js">
blah..
</p>
</video>
Try below.
data-setup='{"fluid": true, "aspectRatio": "16:9"}'.
It's fixed in video.js 5.13 (per-release), but here fluid mode is collapsing the player on Android on cellular networks because Chrome overrides preload to node.
Had the same issue. In Chrome the poster would flash for a split second and then disappear. Fixed it by setting preload to false: preload="false"

HTML Video on Android - Mute / Unmute control not available

I have enabled controls in my video tag so that users can unmute the video when it is playing on Desktop, the issue I have having is that on Android it continues to play muted with control option to unmute, also on iOS, it plays unmuted by default.
My code is:
<video id="player" width="430" height="236" style="position:absolute; top:7px; left:52px;" poster="movie.jpg" muted autoplay controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogv" type="video/ogg">
<img width="430" height="236" style="position:absolute; top:7px; left:52px;" src="movie.jpg" />
</video>
I can't find any answer anywhere. Desktop works fine.
on iOS devices you can't mute or change volume HTML video (:
http://blog.millermedeiros.com/unsolved-html5-video-issues-on-ios/

html5 video is not playing on android phone

i'm using html5 video player from http://www.videojs.com/ to play videos. the video works on normal pc but on android it doesn't play here's the link http://www.mawk3y.net/video/ and here's the head code
<link href="http://vjs.zencdn.net/4.6/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/4.6/video.js"></script>
body code
<video id="video_1" class="video-js vjs-default-skin" controls
preload="auto" width="640" height="264" poster="uploads/example.jpg"
data-setup="{}">
<source src="uploads/video.mp4" type='video/mp4'>
<source src="uploads/video.webm" type='video/webm'>
<p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
</video>
Plays ok for me on android 4.4.2, what version of android are you testing on. Older versions of Android have shaky support for the video element, particularly 2.2 or below

Categories

Resources