Pagamento Sucesso 2 - Memô

Tudo certo com o seu pagamento!

Você já pode inserir acervos, montar uma exposição e coletar histórias.

const canvasEl = document.querySelector(‘#canvas’); const w = canvasEl.width = window.innerWidth; const h = canvasEl.height = window.innerHeight * 2; function loop() { requestAnimationFrame(loop); ctx.clearRect(0,0,w,h); confs.forEach((conf) => { conf.update(); conf.draw(); }) } function Confetti () { //construct confetti const colours = [‘#fde132’, ‘#009bde’, ‘#ff6b00’]; this.x = Math.round(Math.random() * w); this.y = Math.round(Math.random() * h)-(h/2); this.rotation = Math.random()*360; const size = Math.random()*(w/60); this.size = size 0.5 ? 1 : -1; } Confetti.prototype.border = function() { if (this.y >= h) { this.y = h; } } Confetti.prototype.update = function() { this.y += this.speed; if (this.y h) this.border(); }; Confetti.prototype.draw = function() { ctx.beginPath(); ctx.arc(this.x, this.y, this.size, this.rotation, this.rotation+(Math.PI/2)); ctx.lineTo(this.x, this.y); ctx.closePath(); ctx.globalAlpha = this.opacity; ctx.fillStyle = this.color; ctx.fill(); }; const ctx = canvasEl.getContext(‘2d’); const confNum = Math.floor(w / 4); const confs = new Array(confNum).fill().map(_ => new Confetti()); loop(); #canvas{ position:absolute; z-index:1; width:100%; height:auto; bottom:0px; left:0px; z-index:1; } #mensagem{ position:relative; z-index:10; } #conteudo{ position:relative; z-index:10; }