// Main JavaScript file for functionality document.addEventListener('DOMContentLoaded', function() { // Smooth scrolling for anchor links document.querySelectorAll('a[href^="#"]').forEach(anchor => { anchor.addEventListener('click', function (e) { e.preventDefault(); const targetId = this.getAttribute('href'); if (targetId === '#') return; const targetElement = document.querySelector(targetId); if (targetElement) { targetElement.scrollIntoView({ behavior: 'smooth' }); } }); }); // 3D Mouse Movement Effect const handleMouseMove = (e) => { const xAxis = (window.innerWidth / 2 - e.pageX) / 25; const yAxis = (window.innerHeight / 2 - e.pageY) / 25; document.querySelector('main').style.transform = `rotateY(${xAxis}deg) rotateX(${yAxis}deg)`; }; // Animation for elements when they come into view const animateOnScroll = () => { const elements = document.querySelectorAll('.animate-on-scroll'); elements.forEach(element => { const elementPosition = element.getBoundingClientRect().top; const windowHeight = window.innerHeight; if (elementPosition < windowHeight - 100) { const depth = element.dataset.depth || 0; element.style.transform = `translateZ(${depth}px)`; element.classList.add('animate-fadeInUp'); } }); }; // Add mouse move event document.addEventListener('mousemove', handleMouseMove); // Initialize animation on load and scroll window.addEventListener('load', animateOnScroll); window.addEventListener('scroll', animateOnScroll); // Form submission handling const contactForm = document.querySelector('form'); if (contactForm) { contactForm.addEventListener('submit', function(e) { e.preventDefault(); // Here you would typically send the form data to a server alert('Thank you for your message! I will get back to you soon.'); this.reset(); }); } });