javascript之雪花特效

最新推荐文章于 2024-02-03 06:15:28 发布

汤原儿

最新推荐文章于 2024-02-03 06:15:28 发布

阅读量779

点赞数 3

文章标签： javascript 前端 css 学习

本文链接：https://blog.csdn.net/m0_59537414/article/details/126875970

版权

css代码块

      * {
            padding: 0;
            margin: 0;
        }

        body {
            height: 100vh;
        }

        .iconfont {
            position: absolute;
        }

js代码部分

<script>
        // 随机颜色
        function color() {
            var r = Math.round(Math.random() * 255);
            var g = Math.round(Math.random() * 255);
            var b = Math.round(Math.random() * 255);
            return `rgb(${r},${g},${b})`;
        }

        // 创建一个雪花
        function snowDown() {
            var posY = -60, // 雪花的top
                speed = Math.random() * 10 + 5, // 雪花下落的速度
                scale = Math.round(Math.random()), //雪花缩放的大小
                // 因为用的是字体，font-size最小是12px，所以对雪花进行缩放控制大小
                deg = Math.round(Math.random() * 360); // 雪花旋转的角度
            //创建一个雪花
            var snow =