-
@@ -827,6 +863,198 @@ async function init() {
init();
+// ========== Hero 动态壁纸 + 光追效果 ==========
+// 导航栏滚动变色
+window.addEventListener('scroll', function() {
+ var navbar = document.querySelector('.navbar');
+ var topbar = document.querySelector('.topbar');
+ if (window.scrollY > 80) {
+ navbar.style.background = 'rgba(255,255,255,0.95)';
+ navbar.style.backdropFilter = 'blur(20px)';
+ navbar.style.boxShadow = '0 2px 12px rgba(0,0,0,0.06)';
+ navbar.style.borderBottomColor = 'rgba(0,0,0,0.06)';
+ var links = navbar.querySelectorAll('.nav-links a, .nav-brand, .search-box input, .search-box svg, .nav-actions span');
+ links.forEach(function(el){ el.style.color = ''; });
+ var search = navbar.querySelector('.search-box');
+ if (search) { search.style.background = 'var(--bg)'; search.style.border = '1px solid var(--border)'; }
+ } else {
+ navbar.style.background = 'rgba(10,10,15,0.6)';
+ navbar.style.boxShadow = 'none';
+ navbar.style.borderBottomColor = 'rgba(255,255,255,0.06)';
+ }
+ if (topbar) topbar.style.opacity = window.scrollY > 32 ? '0' : '1';
+});
+
+(function(){
+ var canvas = document.getElementById('heroCanvas');
+ if (!canvas) return;
+ var ctx = canvas.getContext('2d');
+ var heroLight = document.getElementById('heroLight');
+ var W = 0, H = 0, dpr = window.devicePixelRatio || 1;
+
+ function resize() {
+ var rect = canvas.getBoundingClientRect();
+ W = rect.width; H = rect.height;
+ canvas.width = W * dpr; canvas.height = H * dpr;
+ ctx.scale(dpr, dpr);
+ }
+ resize();
+ window.addEventListener('resize', resize);
+
+ // 粒子系统 — 流动的光丝
+ var particles = [];
+ var PARTICLE_COUNT = 80;
+ for (var i = 0; i < PARTICLE_COUNT; i++) {
+ particles.push({
+ x: Math.random() * W,
+ y: Math.random() * H,
+ vx: (Math.random() - 0.5) * 0.3,
+ vy: (Math.random() - 0.5) * 0.3,
+ size: Math.random() * 3 + 1,
+ hue: Math.random() < 0.6 ? 355 : (Math.random() < 0.5 ? 45 : 15), // 红/金/橙
+ alpha: Math.random() * 0.5 + 0.4,
+ life: Math.random()
+ });
+ }
+
+ // 鼠标位置
+ var mx = W / 2, my = H / 2;
+ var hasMouse = false;
+
+ canvas.parentElement.addEventListener('mousemove', function(e) {
+ var rect = canvas.getBoundingClientRect();
+ mx = e.clientX - rect.left;
+ my = e.clientY - rect.top;
+ if (!hasMouse) { hasMouse = true; heroLight.classList.add('active'); }
+ heroLight.style.left = mx + 'px';
+ heroLight.style.top = my + 'px';
+ });
+ canvas.parentElement.addEventListener('mouseleave', function() {
+ hasMouse = false;
+ heroLight.classList.remove('active');
+ });
+
+ // 动态壁纸主循环
+ function animate() {
+ // 深色背景渐变
+ var grad = ctx.createRadialGradient(W * 0.3, H * 0.4, 0, W * 0.3, H * 0.4, W * 0.8);
+ grad.addColorStop(0, 'rgba(30,15,20,0.15)');
+ grad.addColorStop(1, 'rgba(10,10,15,0.2)');
+ ctx.fillStyle = 'rgba(10,10,15,0.15)';
+ ctx.fillRect(0, 0, W, H);
+ ctx.fillStyle = grad;
+ ctx.fillRect(0, 0, W, H);
+
+ // 绘制流动的曲线网络
+ for (var i = 0; i < particles.length; i++) {
+ var p = particles[i];
+
+ // 鼠标吸引/排斥
+ if (hasMouse) {
+ var dx = mx - p.x;
+ var dy = my - p.y;
+ var dist = Math.sqrt(dx * dx + dy * dy);
+ if (dist < 200) {
+ var force = (1 - dist / 200) * 0.02;
+ p.vx += dx / dist * force;
+ p.vy += dy / dist * force;
+ }
+ }
+
+ // 更新位置
+ p.x += p.vx;
+ p.y += p.vy;
+ p.vx *= 0.98;
+ p.vy *= 0.98;
+ p.life += 0.005;
+
+ // 边界回弹
+ if (p.x < 0) p.x = W;
+ if (p.x > W) p.x = 0;
+ if (p.y < 0) p.y = H;
+ if (p.y > H) p.y = 0;
+
+ // 绘制粒子
+ var pulse = Math.sin(p.life * Math.PI * 2) * 0.3 + 0.7;
+ var r = p.size * pulse;
+ ctx.beginPath();
+ ctx.arc(p.x, p.y, r, 0, Math.PI * 2);
+ ctx.fillStyle = 'hsla(' + p.hue + ',80%,60%,' + (p.alpha * pulse) + ')';
+ ctx.fill();
+
+ // 光晕
+ ctx.beginPath();
+ ctx.arc(p.x, p.y, r * 3, 0, Math.PI * 2);
+ var glow = ctx.createRadialGradient(p.x, p.y, 0, p.x, p.y, r * 3);
+ glow.addColorStop(0, 'hsla(' + p.hue + ',80%,60%,' + (p.alpha * 0.3) + ')');
+ glow.addColorStop(1, 'transparent');
+ ctx.fillStyle = glow;
+ ctx.fill();
+
+ // 连线 — 近距离粒子之间
+ for (var j = i + 1; j < particles.length; j++) {
+ var p2 = particles[j];
+ var ldx = p.x - p2.x;
+ var ldy = p.y - p2.y;
+ var ld = Math.sqrt(ldx * ldx + ldy * ldy);
+ if (ld < 150) {
+ var la = (1 - ld / 150) * 0.25;
+ ctx.beginPath();
+ ctx.moveTo(p.x, p.y);
+ ctx.lineTo(p2.x, p2.y);
+ ctx.strokeStyle = 'hsla(' + p.hue + ',70%,55%,' + la + ')';
+ ctx.lineWidth = 0.5;
+ ctx.stroke();
+ }
+ }
+
+ // 鼠标光追连线 — 鼠标附近的粒子向鼠标发射光线
+ if (hasMouse) {
+ var mdx = p.x - mx;
+ var mdy = p.y - my;
+ var md = Math.sqrt(mdx * mdx + mdy * mdy);
+ if (md < 250) {
+ var ma = (1 - md / 250) * 0.4;
+ ctx.beginPath();
+ ctx.moveTo(p.x, p.y);
+ ctx.lineTo(mx, my);
+ ctx.strokeStyle = 'rgba(230,57,70,' + ma + ')';
+ ctx.lineWidth = 1;
+ ctx.stroke();
+
+ // 光追射线效果 — 在鼠标周围有明亮光点
+ ctx.beginPath();
+ ctx.arc(mx, my, 2, 0, Math.PI * 2);
+ ctx.fillStyle = 'rgba(255,255,255,0.8)';
+ ctx.fill();
+ }
+ }
+ }
+
+ // 鼠标处的光追放射线
+ if (hasMouse) {
+ for (var k = 0; k < 8; k++) {
+ var angle = (k / 8) * Math.PI * 2 + Date.now() * 0.0003;
+ var len = 80 + Math.sin(Date.now() * 0.002 + k) * 20;
+ var ex = mx + Math.cos(angle) * len;
+ var ey = my + Math.sin(angle) * len;
+ var rayGrad = ctx.createLinearGradient(mx, my, ex, ey);
+ rayGrad.addColorStop(0, 'rgba(230,57,70,0.15)');
+ rayGrad.addColorStop(1, 'transparent');
+ ctx.beginPath();
+ ctx.moveTo(mx, my);
+ ctx.lineTo(ex, ey);
+ ctx.strokeStyle = rayGrad;
+ ctx.lineWidth = 2;
+ ctx.stroke();
+ }
+ }
+
+ requestAnimationFrame(animate);
+ }
+ animate();
+})();
+
// ========== 3D 动态效果 & 鼠标光影（新增）==========
(function(){
var isTouch = window.matchMedia('(hover: none)').matches;