Changed around line 1
+ class ParticleSystem {
+ constructor() {
+ this.canvas = document.getElementById('particleCanvas');
+ this.ctx = this.canvas.getContext('2d');
+ this.particles = [];
+ this.mouse = { x: 0, y: 0 };
+ this.init();
+ }
+
+ init() {
+ this.resize();
+ window.addEventListener('resize', () => this.resize());
+ this.canvas.addEventListener('mousemove', (e) => this.handleMouseMove(e));
+ this.createParticles();
+ this.animate();
+ }
+
+ resize() {
+ this.canvas.width = window.innerWidth;
+ this.canvas.height = window.innerHeight;
+ }
+
+ handleMouseMove(e) {
+ this.mouse.x = e.clientX;
+ this.mouse.y = e.clientY;
+ }
+
+ createParticles() {
+ for (let i = 0; i < 100; i++) {
+ this.particles.push({
+ x: Math.random() * this.canvas.width,
+ y: Math.random() * this.canvas.height,
+ size: Math.random() * 3 + 1,
+ speedX: Math.random() * 3 - 1.5,
+ speedY: Math.random() * 3 - 1.5
+ });
+ }
+ }
+
+ animate() {
+ this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+
+ this.particles.forEach(particle => {
+ particle.x += particle.speedX;
+ particle.y += particle.speedY;
+
+ if (particle.x > this.canvas.width) particle.x = 0;
+ if (particle.x < 0) particle.x = this.canvas.width;
+ if (particle.y > this.canvas.height) particle.y = 0;
+ if (particle.y < 0) particle.y = this.canvas.height;
+
+ const dx = this.mouse.x - particle.x;
+ const dy = this.mouse.y - particle.y;
+ const distance = Math.sqrt(dx * dx + dy * dy);
+
+ if (distance < 100) {
+ const angle = Math.atan2(dy, dx);
+ particle.x -= Math.cos(angle) * 1;
+ particle.y -= Math.sin(angle) * 1;
+ }
+
+ this.ctx.beginPath();
+ this.ctx.arc(particle.x, particle.y, particle.size, 0, Math.PI * 2);
+ this.ctx.fillStyle = '#00d4ff';
+ this.ctx.fill();
+ });
+
+ requestAnimationFrame(() => this.animate());
+ }
+ }
+
+ document.addEventListener('DOMContentLoaded', () => {
+ new ParticleSystem();
+
+ // Smooth scrolling
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+ });
+ });
