<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>蛆</TITLE>
<style>
body, html {
position: absolute;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
overflow: hidden;
background: #3b2f2f;
}
canvas {
position: absolute;
width: 100%;
height: 100%;
cursor: pointer;
}
#maggot_node {
display: none;
}
</style>
</HEAD>
<BODY>
<img id="maggot_node"
src=
alt="maggot_image">
<script>
"use strict";
{
const maggotCount = 25;
const minDistance = 100;
const Maggot = class {
constructor(x, y) {
this.length = 80 + Math.round(120 * Math.random()); // 增加蛆虫长度
this.amp = 0.3 + 0.5 * Math.random(); // 增大振幅
this.freq = 0.07 + 0.4 * Math.random(); // 增大频率
this.dir = 2 * Math.PI * Math.random();
this.vel = 1.0 + Math.random() * 1.0; // 提高速度
this.frame = 0;
this.free = true;
this.vDir = 0;
this.nodes = [];
for (let i = 0; i < this.length; i++) {
this.nodes.push(
new Maggot.Node(
this,
i,
i === 0 ? x : (canvas.width * Math.random()),
i === 0 ? y : (canvas.height * Math.random())
)
);
}
}
move() {
const head = this.nodes[0];
// 边界检查并调整方向
if (head.x > canvas.width) {
head.x = canvas.width;
this.dir += Math.PI / 2;
} else if (head.x < 0) {
head.x = 0;
this.dir -= Math.PI / 2;
}
if (head.y > canvas.height) {
head.y = canvas.height;
this.dir += Math.PI / 2;
} else if (head.y < 0) {
head.y = 0;
this.dir -= Math.PI / 2;
}
const dx = pointer.x - head.x;
const dy = pointer.y - head.y;
const dist = Math.sqrt(dx * dx + dy * dy);
if (dist < 300) {
if (this.free) {
this.dir = Math.atan2(dy, dx) + (Math.random() - 0.5) * 0.4; // 增加方向随机性
this.vel = 1.0 + dist * 0.015; // 提高速度
if (dist < 50) {
this.dir += (Math.random() - Math.random()) * Math.PI * 0.7; // 增大方向变化幅度
}
if (dist < 1) {
this.free = false;
}
}
} else {
this.vel = 1.0 + Math.random() * 1.0; // 提高速度
this.free = true;
}
// 增加移动的随机性和灵活性
this.vDir += 0.07 * (Math.random() - Math.random());
this.dir += this.vDir;
this.vDir *= 0.8; // 减小阻尼以保持更长时间的方向变化
head.x += this.vel * Math.cos(this.dir);
head.y += this.vel * Math.sin(this.dir);
this.frame += this.freq;
const iDir = this.amp * Math.cos(this.frame);
const iHead = this.nodes[1];
iHead.x = head.x - this.vel * Math.cos(this.dir + iDir);
iHead.y = head.y - this.vel * Math.sin(this.dir + iDir);
for (let i = 2; i < this.length; i++) {
this.nodes[i].move();
}
}
};
Maggot.Node = class {
constructor(maggot, i, x, y) {
this.maggot = maggot;
// 使用 s = maggot.length - i，使头部最大
const s = maggot.length - i;
this.baseSize = (3 + s * s / maggot.length) * (1 + Math.random() * 0.3);
this.size = this.baseSize;
this.prev = i > 0 ? maggot.nodes[i - 1] : null;
this.pprev = i > 1 ? maggot.nodes[i - 2] : null;
this.x = x;
this.y = y;
this.a = 0;
this.img = document.getElementById("maggot_node");
}
move() {
if (!this.pprev) return;
const dx = this.x - this.pprev.x;
const dy = this.y - this.pprev.y;
this.a = Math.atan2(dy, dx);
const d = Math.sqrt(dx * dx + dy * dy);
const jitter = 0.5 * (Math.random() - Math.random()); // 增加抖动幅度
this.x = this.prev.x + (dx * 10 / d) + jitter;
this.y = this.prev.y + (dy * 10 / d) + jitter;
const pulse = 1 + 0.2 * (Math.random() - Math.random()); // 增大脉动幅度
this.size = this.baseSize * pulse;
ctx.save();
ctx.translate(this.x, this.y);
ctx.rotate(this.a + 0.4);
// 绘制黏液轨迹
ctx.globalAlpha = 0.3;
ctx.strokeStyle = `rgba(80, 30, 30, 0.6)`; // 更暗的黏液颜色
ctx.lineWidth = this.size * 0.25;
ctx.beginPath();
ctx.moveTo(-this.size * 0.5, 0);
ctx.bezierCurveTo(-this.size, this.size * 0.4, -this.size, -this.size * 0.4, -this.size * 0.5, 0);
ctx.stroke();
// 绘制阴影
ctx.globalAlpha = 0.4;
ctx.fillStyle = `rgba(0, 0, 0, 0.5)`;
ctx.beginPath();
ctx.ellipse(5, 5, this.size * 0.5, this.size * 0.2, Math.PI / 4, 0, Math.PI * 2);
ctx.fill();
// 重置透明度
ctx.globalAlpha = 1.0;
// 绘制腐烂效果
// 深色斑点
if (Math.random() < 0.35) {
ctx.fillStyle = `rgba(80, 30, 30, 0.7)`;
ctx.beginPath();
ctx.arc((Math.random() - 0.5) * this.size, (Math.random() - 0.5) * this.size, this.size * 0.35, 0, Math.PI * 2);
ctx.fill();
}
// 霉菌或真菌生长
if (Math.random() < 0.25) {
ctx.fillStyle = `rgba(50, 50, 50, 0.6)`;
ctx.beginPath();
ctx.fillRect(-this.size * 0.3, -this.size * 0.3, this.size * 0.6, this.size * 0.6);
ctx.fill();
}
// 绘制蛆虫图像
if (this.img && this.img.complete) { // 确保图片已加载
ctx.drawImage(this.img, -this.size * 0.5, -this.size * 0.5, this.size, this.size);
}
ctx.restore();
}
};
const canvas = {
init() {
this.elem = document.createElement("canvas");
document.body.appendChild(this.elem);
this.resize();
window.addEventListener("resize", () => this.resize(), false);
return this.elem.getContext("2d");
},
resize() {
this.width = this.elem.width = window.innerWidth;
this.height = this.elem.height = window.innerHeight;
}
};
const pointer = {
init(canvas) {
this.x = -1000;
this.y = 0;
["mousemove", "touchstart", "touchmove"].forEach((event, index) => {
document.addEventListener(
event,
e => {
e.preventDefault();
if (e.touches && e.touches.length > 0) {
this.x = e.touches[0].clientX;
this.y = e.touches[0].clientY;
} else {
this.x = e.clientX;
this.y = e.clientY;
}
},
false
);
});
}
};
const ctx = canvas.init();
pointer.init(canvas);
const heads = [];
function getRandomPositionNoOverlap() {
let pos;
let tries = 0;
do {
pos = {
x: Math.random() * canvas.width,
y: Math.random() * canvas.height
};
let tooClose = false;
for (let h of heads) {
const dx = pos.x - h.x;
const dy = pos.y - h.y;
if (Math.sqrt(dx * dx + dy * dy) < minDistance) {
tooClose = true;
break;
}
}
if (!tooClose) break;
tries++;
} while (tries < 100);
return pos;
}
const maggots = [];
for (let i = 0; i < maggotCount; i++) {
const pos = getRandomPositionNoOverlap();
heads.push(pos);
maggots.push(new Maggot(pos.x, pos.y));
}
function drawBackgroundStains() {
for (let i = 0; i < 150; i++) { // 增加背景斑点数量
ctx.beginPath();
const x = Math.random() * canvas.width;
const y = Math.random() * canvas.height;
const radius = Math.random() * 25; // 增大斑点半径
const palette = [
[100, 20, 20],
[60, 40, 10],
[50, 80, 40],
[40, 40, 40],
[120, 100, 40]
];
const baseC = palette[Math.floor(Math.random() * palette.length)];
const r = Math.floor(baseC[0] + Math.random() * 50);
const g = Math.floor(baseC[1] + Math.random() * 50);
const b = Math.floor(baseC[2] + Math.random() * 50);
ctx.fillStyle = `rgba(${r},${g},${b},${0.15 + Math.random() * 0.4})`; // 增大透明度范围
ctx.arc(x, y, radius, 0, Math.PI * 2);
ctx.fill();
}
for (let i = 0; i < 15; i++) { // 增加线条数量
ctx.beginPath();
ctx.strokeStyle = `rgba(100, 20, 20, 0.4)`; // 增加透明度
ctx.lineWidth = 2 + Math.random() * 3; // 增大线宽
ctx.moveTo(Math.random() * canvas.width, Math.random() * canvas.height);
for (let j = 0; j < 4; j++) { // 增加线条段数
ctx.lineTo(Math.random() * canvas.width, Math.random() * canvas.height);
}
ctx.stroke();
}
}
drawBackgroundStains();
const run = () => {
requestAnimationFrame(run);
// 使用半透明覆盖实现运动模糊效果
ctx.fillStyle = "rgba(59, 47, 47, 0.1)"; // 增大覆盖透明度以增强模糊效果
ctx.fillRect(0, 0, canvas.width, canvas.height);
drawBackgroundStains();
for (const maggot of maggots) {
maggot.move();
}
};
run();
}
</script>
</BODY>
</HTML>