Internet Animated Background

Open In Editor Video Publish Your Code

if (distance < maxDistance) {
                ctx.beginPath();
                ctx.moveTo(nodes[i].x, nodes[i].y);
                ctx.lineTo(nodes[j].x, nodes[j].y);
                ctx.strokeStyle = `rgba(0, 255, 204, ${1 - distance / maxDistance})`;
                ctx.stroke();
            }
        }
    }
}

function animate() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

for (const node of nodes) {
        node.update();
        node.draw();
    }

drawConnections();

requestAnimationFrame(animate);
}

animate();

window.addEventListener('resize', () => {
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
});

Internet Animated Background

Recommended

Animated Venn Diagram

Button with animated Dracula hover effect

animated padlock

HTML

CSS

JS

Recommended

Animated Venn Diagram

Button with animated Dracula hover effect

animated padlock

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS