Auf einer Homepage soll ein Video-Intro präsentiert werden. Sobald man die Seite aufruft, wird ein Video abgespielt und man wird auf die eigentliche Seite geleitet.
Das funktioniert super mit HTML5 und einer CSS-Datei. Nur leider geht das Video auf dem Handy nicht. Das Autoplay startet nicht.
Ich dachte, es liegt daran, dass Autoplay auf mobil deaktiviert ist. Also wollte ich, dass man das Video dann wenigstens manuell per Klick starten kann. Das geht aber auch nicht. Man sieht auf Android lediglich das Startbild des Videos, mehr nicht.
Der CSS-Code ist:
video::-webkit-media-controls {
display: none;
}
body {
text-align: center;
}
#vid {
display: inline-block;
/*Hier stand noch pointer events none. Das hab ich weg gemacht, trotzdem geht es leider nicht*/
padding-top: 100px;
}
Der HTML-Code ist:
<div id="vidContainer">
<video id="vid" autoplay=true controls=false>
<source src="video.mp4" type="video/mp4">
<source src="video.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
<br /><br />
<font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#CCCCCC">
©TEX TEXT TEXT
</font>
<br /><br /><br />
<a href="LINK ZUR MAINSEITE">
<img src="/bilder/skipbutton.png" alt="Skip" />
</a>
<img src="BILD" width="1" height="1">
</div>
</div>
</body>
</html>
<script>
window.setTimeout(function() {
window.location = "LINK ZUR MAINSEITE";
}, 17000);
</script>