Problem
Ein Hero- oder Container-Hintergrund soll automatisch zwischen mehreren Bildern wechseln.
Die Lösung
Für einen fließenden Wechsel werden mehrere absolut positionierte Bildebenen im selben Container übereinandergelegt. Per CSS-Animation wird jeweils nur eine Ebene sichtbar, während die vorige ausblendet.
Der Container braucht eine definierte Höhe und overflow:hidden. Text und Buttons liegen auf einer höheren Ebene, damit sie während des Bildwechsels stabil bleiben. Für einen ruhigen Effekt kurze Schwarzpausen vermeiden und Ein-/Ausblendzeiten leicht überlappen.