Webleb - Snippets de Código -

2743 Vijay

Abrir no Editor Video Publique Seu Código

Recomendado

23 May 2025

Menu de hambúrguer com login 3D

26 August 2025

Animação de ansiedade HTML: texto piscando

18 December 2025

Jogo em HTML5 Canvas: "Basta apertar o botão"

HTML

CSS

JS

const canvas = document.getElementById('canvas');
        const ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

let particlesArray = [];

class Particle {
            constructor() {
                this.x = Math.random() * canvas.width;
                this.y = Math.random() * canvas.height;
                this.size = Math.random() * 5 + 1;
                this.speedX = Math.random() * 3 - 1.5;
                this.speedY = Math.random() * 3 - 1.5;
            }
            update() {
                this.x += this.speedX;
                this.y += this.speedY;
                
                if (this.size > 0.2) this.size -= 0.1;
            }
            draw() {
                ctx.fillStyle = 'white';
                ctx.beginPath();
                ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
                ctx.fill();
            }
        }

function init() {
            for (let i = 0; i < 100; i++) {
                particlesArray.push(new Particle());
            }
        }

init();
        animate();

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

Recomendado

Menu de hambúrguer com login 3D

Animação de ansiedade HTML: texto piscando

Jogo em HTML5 Canvas: "Basta apertar o botão"

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS