张灯结彩（恭贺消暑活动成功）
<style>#papa { left: -302px; width: 1200px; height: 650px; display: grid; place-items: center;box-shadow: 3px 3px 20px #000; opacity: .95; position: relative; z-index: 3; }
#lrcbox { position: absolute; top: 20px; font: normal 1.8em sans-serif; color: #50616d; text-shadow: 1px 1px 2px #000, -5px -5px 10px rgba(0,0,0,.65); }
#disc { position: absolute; width: 50px; height: 50px; left: 20px; bottom: 20px; background: conic-gradient(red,orange,yellow,green,teal,blue,purple); mask: radial-gradient(transparent 5px,red 0); -webkit-mask: radial-gradient(transparent 5px,red 0); border-radius: 50%; cursor: pointer; z-index: 10; animation: rot 2s linear infinite; }
#canv { margin: auto; display: block; position: relative; border: 1px solid; }
@keyframes rot { to { transform: rotate(360deg); } }
</style>
<div id="papa">
<canvas id="canv"></canvas>
<span id="disc"></span>
<div style="position: absolute; left:790px; top: 450px; width:101px;">
<img alt="" src="https://pic.imgdb.cn/item/62ea9afc16f2c2beb1a23b36.gif"/></div>
<div style="position: absolute; left:500px; top: 480px; width:188px;">
<img alt="" src="https://pic.imgdb.cn/item/62ea9b4516f2c2beb1a2862b.gif"/></div>
</div>
<script>
let ctx = canv.getContext('2d'), mypic = new Image(), aud = new Audio();
let w = canv.width = papa.offsetWidth, h = canv.height = papa.offsetHeight;
let num = (x,y) => Math.floor(Math.random() * (x - y + 1) + y);
mypic.src = 'https://pic.imgdb.cn/item/63064b6316f2c2beb1d27426.jpg';
mypic.onload = () => draw();
aud.src = 'http://www.kumeiwp.com/sub/filestores/2021/09/21/940a4d4d5d23a760864158ce1c75737f.mp3';
aud.loop = true;
aud.autoplay = true;
disc.style.animationPlayState = aud.paused ? 'paused' : 'running';
disc.onclick = () => aud.paused ? aud.play() : aud.pause();
aud.addEventListener('playing', () => disc.style.animationPlayState = 'running');
aud.addEventListener('pause', () => disc.style.animationPlayState = 'paused');
aud.addEventListener('timeupdate', () => draw());
function draw() {
ctx.clearRect(0, 0, canv.width, canv.height);
ctx.drawImage(mypic, 0, 0, w, h);
ctx.shadowOffsetX = 4;
ctx.shadowOffsetY = 4;
ctx.shadowBlur = 8;
ctx.shadowColor = 'rgba(0,0,0,.5)';
ctx.font = 'bold 52px sans-serif';
ctx.textAlign = 'center';
ctx.textBaseline = 'middle';
for(j = 0; j < 100; j ++) {
ctx.fillStyle = 'hsla(' + num(0,360) + ', 100%, 50%, 0.65)';
let r = num(20, 5), x = num(r, canv.width - r), y = num(r, canv.height / 2 - r);
ctx.beginPath();
ctx.arc(x, y, r, 0, Math.PI * 2);
ctx.fill();
}
ctx.strokeStyle = 'hsl(' + num(0, 360) + ', 100%, ' + num(20, 80) + '%)';
ctx.beginPath();
ctx.fillText('恭贺三伏消暑活动圆满成功！', canv.width / 2 + 15, canv.height / 2 + 280);
}
</script> 恭喜《三伏消暑》活动圆满成功，感谢各位对活动的支持{:4_187:} 套用了黑黑《钻石世界》的代码，把小球用来表现彩灯了。并把上传过的跳舞小人随手抓了两个来，一起衬托一下欢乐的气氛。谢谢黑黑的代码@马黑黑{:4_187:} 单位的网没法去找网易云的歌曲，还好在酷美里找到了首挺适合祝贺的音乐{:4_173:} 载歌载舞、欢聚一堂，恭贺《三伏消暑》好的圆满落幕。 梦油 发表于 2022-8-25 10:24
载歌载舞、欢聚一堂，恭贺《三伏消暑》好的圆满落幕。
活动中收获了那么多好作品，真是一次精彩的活动呢{:4_204:} 终于完了。40天过得热火朝天的。 能够控制闪烁小球的位置，这很厉害了。整体构思以及实现手段，已经很成熟。 联系活动前宏大的出场场面，这个更多的表达成分中多了一些狂欢氛围。
红影 发表于 2022-8-25 11:12
活动中收获了那么多好作品，真是一次精彩的活动呢
是的，影子朋友。这次活动精彩纷呈、大获全胜。 亲爱的，特棒，效果很美{:4_178:} 欢乐的场景，热烈的庆贺，活动圆满结束{:4_199:} 黑黑这个效果做贺帖很合适 马黑黑 发表于 2022-8-25 12:44
联系活动前宏大的出场场面，这个更多的表达成分中多了一些狂欢氛围。
感谢黑黑的精彩分享，活动中许多效果都是黑黑分享的，为论坛活动增加了气氛，我就是，喜欢玩黑黑的东东，好玩又简单不用上传，黑神你太厉害了{:4_170:} 加林森 发表于 2022-8-25 12:03
终于完了。40天过得热火朝天的。
是啊，各种好作品层出不穷{:4_204:} 马黑黑 发表于 2022-8-25 12:18
能够控制闪烁小球的位置，这很厉害了。整体构思以及实现手段，已经很成熟。
有你的代码在，只要修改一下数字即可，你的代码才是根本{:4_173:} 马黑黑 发表于 2022-8-25 12:44
联系活动前宏大的出场场面，这个更多的表达成分中多了一些狂欢氛围。
呵呵，一头一尾各做个帖子，也算是有始有终了{:4_173:} 小辣椒 发表于 2022-8-25 14:40
亲爱的，特棒，效果很美
谢谢亲爱的，黑黑这个彩球很容易带来热烈的气氛呢{:4_173:} 小辣椒 发表于 2022-8-25 14:42
欢乐的场景，热烈的庆贺，活动圆满结束
跟亲爱的一起祝贺活动圆满成功{:4_205:} 红影 发表于 2022-8-25 16:35
是啊，各种好作品层出不穷
该给大家评分了！