Hallo!
Über die Suche bin ich leider nicht fündig geworden. Es gab zwar ein paar Einträge zu Hintergrund-Videos, aber dies konnte mir meine Frage nicht beantworten. Deshalb folgendes:
Ich bin Designer und arbeite mit Adobe Muse, einem Tool zur Website-Erstellung auf Designer zugeschneidert. Ich weiß, jeder Coder packt sich nun an den Kopf, aber aus meiner Sicht macht das Tool seine Arbeit gut. Allerdings sind hier natürlich Grenzen gesteckt.
Ich möchte ein Hintergrund-Video auf meiner Seite einfügen, welches immer das Browser-Fenster füllt. Der Content darüber soll ganz normal scrollen. So wie bei dieser Website: arttica.is .
Diese Option bietet das Tool nicht. Man hat jedoch die Möglichkeit, HTML-Code manuell einzufügen. Ich habe folgenden Code im Body eingetragen:
<div id="container">
<video width="100%" preload="auto" autoplay="true" loop="loop">
<source src="assets/video.webm" type="video/webm" />
<source src="assets/video.mp4" type="video/mp4" />
</video>
</div>
body{
margin: 0 0 0 0;
padding: 0 0 0 0;
}
#container{
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: -1;
}
Alles anzeigen
Das Ergebnis könnt ihr unter www.mhgrafikdesign.de/new/printdesign einsehen. Wie ihr sehen könnt, klappt das nicht so ganz. Anscheinend wird der Code ab "body{" ignoriert, da er als normaler Text auftaucht.
Ist etwas an dem Code falsch? Muss ich etwas im Head einfügen? Ich habe davon leider nicht so viel Peil, würde das aber liebend gerne umsetzen.
Hoffentlich gibt es eine Lösung! Wäre dafür echt dankbar!
Viele Grüße
Marc