<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>把回忆拼好给你</title>
<style>
*{margin:0;padding:0;box-sizing:border-box}
body{background:#0b0b20;overflow:hidden}
canvas{display:block;margin:0 auto}
</style>
</head>
<body>
<canvas id="c"></canvas>
<script>
const canvas = document.getElementById('c');
const ctx = canvas.getContext('2d');
function resize(){
canvas.width = 600;
canvas.height = 400;
}
resize();
// 拼图碎片数据
const count = 12;
const pieces = [];
for(let i=0;i<count;i++){
pieces.push({
x: Math.random()*canvas.width,
y: Math.random()*canvas.height,
targetX: 180 + (i%4)*60,
targetY: 120 + Math.floor(i/4)*70,
size:55
})
}
function animate(){
ctx.fillStyle = 'rgba(11,11,32,0.15)';
ctx.fillRect(0,0,canvas.width,canvas.height);
// 绘制碎片,慢慢向目标位置移动
for(let p of pieces){
p.x += (p.targetX - p.x) * 0.018;
p.y += (p.targetY - p.y) * 0.018;
ctx.save();
ctx.shadowColor="#ffffff";
ctx.shadowBlur=12;
ctx.fillStyle="#f8f8ff";
ctx.fillRect(p.x,p.y,p.size,p.size,8);
ctx.restore();
}
// 文字
ctx.fillStyle="#fff";
ctx.font="bold 28px sans-serif";
ctx.fillText("把回忆拼好给你",170,60);
requestAnimationFrame(animate);
}
animate();
</script>
</body>
</html>
2026-10-17
Hi,
Quick question regarding vibe.new — are you currently looking to get your offer directly in front of thousands of website owners daily, without paying for ads or doing manual outreach?
We engineered an automated outreach system and bundled it with a 1,000,000 verified business website database to get you started immediately. It’s built for any business, brand, or service targeting site owners and B2B decision-makers.
If you’re open to taking a look at how the setup works behind the scenes, let me know and I’ll send over a brief breakdown.
Best,
Kate
2026-10-05