Mute and autoplay video on mobile devices using angular 4

Question

I am using html5 video tag in angular 4 app to autoplay video in background. I am unable to auto mute the video and because of that video is not autoplaying on mobile devices. Code I am using is:

<video playsinline autoplay loop controls = "controls" muted = "muted">
   <source src="banner-video.mp4" type="video/mp4" />
   <source src="banner-video.webm" type="video/webm" />
</video>

PS: Video is autoplaying on laptop but is not getting auto muted.

What are you trying to achieve? Mute it by clicking some button? — Leo Odishvili, Mar 22 '18 at 07:43
@LeoOdishvili No, not by click, I want auto mute to work. Its not working — Bobin Singla, Mar 22 '18 at 07:59
Then, I think the problem is that you are using XHTML syntax? Try to write — Leo Odishvili, Mar 22 '18 at 08:17

score 0 · Answer 1 · answered Mar 22 '18 at 09:41

Its like this question, you can read: Making HTML5 Video work on Android phones for tricky autoplay video.

But as described AngryFridges's answer nowadays muted and autoplay for silent video, you can add the 'muted' and 'autoplay' attributes together to enable autoplay for android devices.

e.g.

<video id="video" class="video" autoplay muted >

Mute and autoplay video on mobile devices using angular 4

1 Answers1