Montag bis Freitag 09:00 - 15:00 Uhr
Forum
 
28.11.2014, 10:31

Let it Snow

Sehr geehrte Shopbetreiber,

hier eine kleine Spielerei fürs Auge.

Achtung: Um diesen Effekt sicher im IE nutzen zu können wird empfohlen ein HTML 5 Shoplayout-Layout zu haben.

Wir haben einen sehr schönen rein CSS3 basierten Schnee-Effekt gefunden.

Hier der Code für den Schnee:


body{
    background-color: #6b92b9;
    background-image: url('img/snow.png'), url('img/snow2.png'), url('img/snow3.png');
   
    -webkit-animation: snow 30s linear infinite;
    -moz-animation: snow 30s linear infinite;
    -ms-animation: snow 30s linear infinite;
    animation: snow 30s linear infinite;
}
/*Keyframes*/
@keyframes snow {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}

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

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

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


Hier die Grafiken für den Effekt, die Sie in Ihren IMG-Explorer uploaden müssen:



Grafik1:
Grafik2:
Grafik3:


Dieser Effekt wird nicht direkt ohne Anpassung in jedem Shop funktionieren, da es von Layout zu Layout Unterschiede gibt, die die Einrichtung erschweren können.

Sollten Sie Probleme haben den Effekt ein zurichten können wir das gern für ca. 30min Aufwand übernehmen.

[html] [/html]