当前位置:主页 > JavsScript库 > 动画 >

javascript中的动画降雪效果 - puresnowjs
栏目分类:动画   发布日期:2021-08-15   浏览次数:

使用纯 JavaScript 和 CSS 动画构建的动画降雪效果。

如何使用它:

1. 在文档中加载 PureSnow.js JavaScript。

<script src="./PureSnow.js"></script>


2. 创建一个空的 DIV 元素作为降雪效果的容器。

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


3. 将您自己的样式应用到雪花上。

.snowflake {
  position: absolute;
  width: 10px;
  height: 10px;
  background: linear-gradient(white, white);
  border-radius: 50%;
  filter: drop-shadow(0 0 10px white);
}


4. 切换降雪效果。

toggle_snow()


5. 指定要生成的雪花数量。默认值:200。

let snowflakes_count = 300;

官方网站:https://github.com/hyperstown/puresnowjs

相关下载
声源:本站内容均来自互联网,仅供交流学习之用,请勿作商业用途,所有资源版权归原作者所有。如果有侵犯到您的权益,请联系本站删除,谢谢合作!
jQuery库 JavsScript库 Html5库 CSS3库