Kaut gan ievietot animētu sniegu lapā, vai tas būtu no mums vai no klienta, tas izklausās kā dizaina prakse, kas ir vecāka par visu citu, patiesība ir tāda, ka animācija ko mēs šoreiz pasniedzam, ir eleganta jūra. Tas arī nav nepieciešams JavaScript, tas ir vienkārši CSS3.
Pirmā lieta ir ieskatīties animācija.
Izskatās diezgan labi, vai ne? Lai to ieviestu praksē, mums ir jāizveido tikai trīs attēli ar baltiem punktiem un jā animē tie, izmantojot īpašumu @ keyframes CSS3 šādi:
/*Keyframes*/
@keyframes snow {
0% {background-position: 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
Pievienojot atšķirīgo prefiksus dažādām pārlūkprogrammām, pēc tam mūsu ķermenim izveidojot:
body {
background-color: #6b92b9;
background-image: url('snow.png'), url('snow3.png'), url('snow2.png');
animation: snow 20s linear infinite;
}
Pievienojot arī nepieciešamos priedēkļus. Pilna procedūra ar detalizētiem paskaidrojumiem, pateicoties Džošua Džonsona, ir atrodama viņa emuārā.
Vairāk informācijas - CSS3 gradienta ģenerators, CSS3 gradienta ģenerators
Avots - Dizaina shack