How to Schneeflocken-Effekt: Wie Du es auf der Website schneien lassen kannst

Sorge mit diesem coolen Schneeflocken-Effekt ohne zusätzliches Plugin für Weihnachtsstimmung auf Deiner Website! Ich zeige Dir im Video wie. Let it snow ❄️

Ein cooler Overlay-Effekt für Deine Website

Let it snow, let it snow, let it snow ❄️ In diesem Video zeige ich, wie Du mit wenigen Klicks für eine winterliche Stimmung auf Deiner Website sorgst.

Öffne die gewünschte Seite, auf der Du den Effekt anzeigen lassen möchtest, in Elementor. Dann gehe im Menü oben rechts auf die drei Striche > Seiteneinstellungen > Individuelle CSS.

Dort fügst den CSS Code von unter diesem Video ein und speicherst die Einstellungen.

Zurück auf der Seite, gehe in die Einstellungen des Abschnitts, wo Du den Effekt anzeigen lassen willst. Unter > Erweitert kannst Du die CSS Klasse „snow-ol“ bei > CSS-Klassen angeben. Abspeichern und siehe da, es schneit auf Deiner Website.

Code zum Kopieren für den Schneeflocken-Effekt

/**SNOWFLAKE OVERLAY**/
.snow-ol {
   position: relative;
}

.snow-ol:after {
   content: '';
   display: block;
   position: absolute;
   z-index: 2;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   pointer-events: none;
   background-image: url('https://brittajust.com/wp-content/uploads/2023/11/snow1.png'), url('https://brittajust.com/wp-content/uploads/2023/11/snow2.png'), url('https://brittajust.com/wp-content/uploads/2023/11/snow3.png');
    animation: snow 10s linear infinite;
}

@keyframes snow {
 0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
 50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
 100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}


/**HEART OVERLAY**/
.heart-ol {
   position: relative;

Viel Spaß beim Schneien lassen!