Video als Background so geht es

Falls ihr in eurem Woltlab Forum (WSC 3.1) ein Video als Hintergrund erstellen wollt geht einfach so hervor

1. Erstelle eine Box mit Box-Typ Html
2. Position : Über Inhaltsbereich
3. css Klasse Zuweisen : wrapper-global-background-video
4. Inhalt : HTML

<video width="1920" height="1080" id="global_background_video" autoplay muted loop preload="auto">
 <source src="../video.mp4" type="video/mp4">
</video>

1. Box Überall Sichtbar

Jetzt Im benutztem Stil oder bei Stilunabhängiges CSS und SCSS folgenden Css Code einfügen :

#pageContainer .wrapper-global-background-video {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 z-index: 0;
 margin-top: -26px;
}

.pageFooterStickyNotice, #pageHeader {
 z-index: 999;
}

.dropdownMenuContainer {
 z-index: 999;
}

.balloonTooltip {
 z-index: 999!important;
}

.main {
z-index: 100;
}

.pageNavigation {
z-index: 100;
}

.boxesFooterBoxes {
z-index: 100;
}

#pageFooter {
z-index: 100;
}

(z-index gegebenenfalls anpassen)

Falls ein kleiner Spalt zwischen der Top-Box entsteht folgender CSS Eintrag einfügen.

.boxesTop {
    border-bottom: 0px solid rgba(14, 48, 7, 1);
}

Dann nur noch ein mp4 Motion Video in den Root deines Verzeichnis hochladen.

Ich selber nutze den Effekt nur im Woltlab Core mit Adventskalender, da sieht es ganz gut aus.

mg Engelchen

Ob das unter der neusten Woltlab Suite noch funktioniert ???
Einfach mal testen und Beitrag dazu schreiben.

mg Engelchen