How To Add Together Snowfall Inwards The Background Of Your Weblog Using Css
Today we’re going to become over a super unproblematic CSS technique that you lot tin role to arrive snowfall on your Blogger blog. It seems peculiarly attractive since it doesn't request scripts, alone CSS too 3 pocket-sized images.
An wages of this method is that past times non using scripts doesn't overload the blog, the disadvantage beingness that users amongst non too then modern browsers, volition non live on able to run into it (in Internet Explorer plant for version 10 too up).
The snowfall volition autumn inwards the background of the blog, which, inwards addition, foreclose interfering amongst links or content (because the flakes are images), too foreclose blocking the visibility of the content of the blog.
Step 2. Click the pocket-sized arrow on the left of... to expand the trend (screenshot 1) too click anywhere within the code expanse to search past times using the CTRL + F keys for the ]]> tag (screenshot 2)
Step 3. Add the next code merely inwards a higher house it:
Step 3. Now, search (CTRL + F) the tag or if you lot can't detect it, search this describe of piece of job below:
Step 4. Just below the tag, add together this:
As you lot tin run into this tricks is real unproblematic too slowly to install, does non block the visibility of blog's content too to a greater extent than or less important, it has no scripts, alone CSS too nix else.
An wages of this method is that past times non using scripts doesn't overload the blog, the disadvantage beingness that users amongst non too then modern browsers, volition non live on able to run into it (in Internet Explorer plant for version 10 too up).
The snowfall volition autumn inwards the background of the blog, which, inwards addition, foreclose interfering amongst links or content (because the flakes are images), too foreclose blocking the visibility of the content of the blog.
How To Add Falling Snow To Blogger Blogspot
Step 1. Go to "Template" too click on the "Edit HTML" button:Step 2. Click the pocket-sized arrow on the left of
Step 3. Add the next code merely inwards a higher house it:
/* Snow falling for Blogger
----------------------------------------------- */
@keyframes snowfall {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
@-moz-keyframes snowfall {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
@-webkit-keyframes snowfall {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
@-ms-keyframes snowfall {
0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
100% {background-position: 500px 1000px, 400px 400px, 300px 300px;}
}
#falling-snow {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjudH6bDjvxdHZ3PhR_1wvXpYWEvD0IpuvgL9BXl7er-ov61-QbAvZudy83HKc7ylgwkYhWqN2hEAtAt2a4dF6lbquu-r9TTDfQ-UtMG6L8pur4KMhC2GdGOSJk3YiT4r0BgoVJhYAtto-o/s1600/snow.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcW6dz0CM6sQVXYXq8UErX5OemcxlTVY1htUmwrIa0OaXd09V6Jp999pdkr5eoRoshQcLmf-_2O9_vGIUH5Lzg84Gt3xEm7VAUC9xvfe-nRyHT9IdAc9MkGly3cx33sJAIkoBA0qslwFIi/s1600/snow3.png), url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirS5PB302e7rpRMcAqUmDsR9ZmyVAhO0nZC0oQR1eJa6Dh1N-OZm9pAmVyxnlyODjKHBQwxCpwBSTMSaykaVMgBf_r1_rAnvcwv5E3RERwJBRH5hWrwbhB4hV6qiEllURKpBlgjZtmPiEz/s1600/snow2.png);
-webkit-animation: snowfall 20s linear infinite;
-moz-animation: snowfall 20s linear infinite;
-ms-animation: snowfall 20s linear infinite;
animation: snowfall 20s linear infinite;
}
Screenshot 1:
Screenshot 2:
Step 3. Now, search (CTRL + F) the tag or if you lot can't detect it, search this describe of piece of job below:
Step 4. Just below the tag, add together this:
Step 6. Save the changes too that's it. Enjoy! :)Step 5. Finally, detect the closing tag too add together this tag merely inwards a higher house it:
As you lot tin run into this tricks is real unproblematic too slowly to install, does non block the visibility of blog's content too to a greater extent than or less important, it has no scripts, alone CSS too nix else.
