How to hide play symbol of video autoplay of ionic app?

Question

So, I have a video playing on the background of an Ionic app. However, when it starts playing, the play symbol appears. Click here to see a video of what happens

As you can see, before playing the video, this symbol pops up and I want to hide it.

Html:

<ion-header [translucent]="true">
  <ion-toolbar color="dark">
    <ion-title style="text-align: center;">
      mDL
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <video class="video" autoplay muted loop>
    <source src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4">
  </video>
</ion-content>

CSS:

.video {
  position: fixed;
  z-index: 2;
  object-fit: fill;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
}

Solution:

Add poster="noposter" to video element. Example:

  <video poster="noposter" class="video" autoplay muted loop>
    <source src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4">
  </video>

No, but it mentions another thread that had the solution! Thanks! Basically I have to had `poster="noposter"` to the video element. — Sérgio Costa, Jun 18 '20 at 16:57
If you found an alternate answer you should add it to the duplicate, not to your question. — Dour High Arch, Jun 19 '20 at 08:21

How to hide play symbol of video autoplay of ionic app?

Solution:

0 Answers0