Internet Animated Background

Open In Editor 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 Lamp

On Hover Animated Button

Animated 404 Error Page with Heart & Particles

HTML

CSS

JS

Recommended

Animated Lamp

On Hover Animated Button

Animated 404 Error Page with Heart & Particles

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS