눈이 내리는 효과 JS

Question

JS 형식을 사용하지 않고 내 사이트에 눈 효과를 줄 수 있습니까? 대신 html5를 사용할 수 있습니까?

이상하게 들리 겠지만 사이트에서 JS를 사용하지 않습니다. (묻지 마시고 explaing하고 싶지 않습니다.) 가능합니까?

감사합니다.

Answer 1

예, 가능합니다.

여기에 CSS3 만있는 example of snow입니다.

마크 업 :

<div id="snow"> 
</div> 

그리고 CSS :

body { background-color:#333; } 
#snow{ 
    background: none; 
    font-family: Androgyne; 
    background-image: url('http://www.wearewebstars.dk/codepen/img/s1.png'), url('http://www.wearewebstars.dk/codepen/img//s2.png'), url('http://www.wearewebstars.dk/codepen/img//s3.png'); 
    height: 100%; 
    left: 0; 
    position: absolute; 
    top: 0; 
    width: 100%; 
    z-index:1; 
    -webkit-animation: snow 10s linear infinite; 
    -moz-animation: snow 10s linear infinite; 
    -ms-animation: snow 10s linear infinite; 
    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;} 
} 
@-moz-keyframes snow { 
    0% {background-position: 0px 0px, 0px 0px, 0px 0px;} 
    50% {background-position: 500px 500px, 100px 200px, -100px 150px;} 
    100% {background-position: 400px 1000px, 200px 400px, 100px 300px;} 
} 
@-webkit-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;} 
} 
@-ms-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;} 
} 

어쨌든, 솔루션이 많이있다. 왜 그냥 구글 (imgtfy 링크를 stackoverflow에 의해 금지 상상)

Answer 2

예. 가능합니다.

이렇게 물어 보는 질문에 가장 적합한 답변입니다.