给网站加下雪的特效

如何给自己的网站加上好看的雪花呢?

今天我就教大家利用js给自己的网站加上特别好看的雪花。先看成品图
给网站加雪花

code here...

    if(true){
        (function() {
            var requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame ||
            function(callback) {
                window.setTimeout(callback, 1000 / 60);
            };
            window.requestAnimationFrame = requestAnimationFrame;
        })();
         
        (function() {
            var flakes = [],
                canvas = document.getElementById("Snow"),
                ctx = canvas.getContext("2d"),
                flakeCount = 200,
                mX = -100,
                mY = -100;
             
            canvas.width = window.innerWidth;
            canvas.height = window.innerHeight;
             
            function snow() {
                ctx.clearRect(0, 0, canvas.width, canvas.height);
             
                for (var i = 0; i < flakeCount; i++) {
                    var flake = flakes[i],
                        x = mX,
                        y = mY,
                        minDist = 150,
                        x2 = flake.x,
                        y2 = flake.y;
             
                    var dist = Math.sqrt((x2 - x) * (x2 - x) + (y2 - y) * (y2 - y)),
                        dx = x2 - x,
                        dy = y2 - y;
             
                    if (dist < minDist) {
                        var force = minDist / (dist * dist),
                            xcomp = (x - x2) / dist,
                            ycomp = (y - y2) / dist,
                            deltaV = force / 2;
             
                        flake.velX -= deltaV * xcomp;
                        flake.velY -= deltaV * ycomp;
             
                    } else {
                        flake.velX *= .98;
© 版权声明
THE END
喜欢就支持一下吧
点赞0
分享
评论 抢沙发
admin的头像-

昵称

取消
昵称表情代码图片