Spaces:
Running
Running
| // Intersection Observer for scroll animations | |
| document.addEventListener('DOMContentLoaded', function() { | |
| // Initialize feather icons | |
| feather.replace(); | |
| const observerOptions = { | |
| threshold: 0.1 | |
| }; | |
| const observer = new IntersectionObserver((entries) => { | |
| entries.forEach(entry => { | |
| if (entry.isIntersecting) { | |
| entry.target.classList.add('animate-fade-in-up'); | |
| observer.unobserve(entry.target); | |
| } | |
| }); | |
| }, observerOptions); | |
| // Observe all sections | |
| document.querySelectorAll('section').forEach(section => { | |
| observer.observe(section); | |
| }); | |
| // 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' | |
| }); | |
| } | |
| }); | |
| }); | |
| // Mobile menu toggle | |
| const mobileMenuBtn = document.querySelector('.mobile-menu-btn'); | |
| const navLinks = document.querySelector('.nav-links'); | |
| if (mobileMenuBtn && navLinks) { | |
| mobileMenuBtn.addEventListener('click', () => { | |
| navLinks.classList.toggle('active'); | |
| }); | |
| } | |
| // Form submission handling | |
| const contactForm = document.querySelector('form'); | |
| if (contactForm) { | |
| contactForm.addEventListener('submit', function(e) { | |
| e.preventDefault(); | |
| // Show success message | |
| const submitBtn = this.querySelector('button[type="submit"]'); | |
| submitBtn.textContent = 'Message Sent!'; | |
| submitBtn.classList.remove('bg-primary'); | |
| submitBtn.classList.add('bg-green-500'); | |
| setTimeout(() => { | |
| submitBtn.textContent = 'Send Message'; | |
| submitBtn.classList.remove('bg-green-500'); | |
| submitBtn.classList.add('bg-primary'); | |
| this.reset(); | |
| }, 3000); | |
| }); | |
| } | |
| }); | |